|
HTML - Tables That Change With Forms?
I was looking to compare business cards, when I came across this website (I don't own the site, and I'm not trying to market it):
http://www.goodmarketingideas.com/to...rds/comparison When you use the form, the one labeled "Comparison Price Calculator", the table on the page changes to show different prices, based on how many business cards you want. I checked the source code, and from what I can see, it's a basic form with nothing special to it. How is this done? I want to mimic this effect, but I can't find any information on how to do this. Any help would be greatly appreciated, thanks. Similar TutorialsTrying to get this code to look like the attached photo; what am I missing? Specifically wondering about the alignment of the labels next to the buttons and text boxes, but any other suggestions would be greatly appreciated. Thanks! Code: <?xml version="1.0" encoding="UTF-8"?> <!-- DOCTYPE tag to declare XHTML 1.0 Transitional --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <!-- Head section containing title, and meta tags for author and editing program --> <head> <title>Lab 7</title> <meta name="Marc" content="CSE HTML Validator Professional (http://www.htmlvalidator.com/)" /> </head> <!-- Body tag with bgcolor, background image, and text, link, vlink, and alink color --> <body bgcolor="white" background="\images\background.jpg" text="black" link="#0000FF" vlink="#FF00FF" alink="#00FF00"> <h1 align="center">Registration Form</h1> <form action="..."> <table width=80% bgcolor="00b2e2"> <tr align="left"> <td width="20%" colspan="4"><u><b>Student Information</b></u></td> </tr> <tr align="center"> <td width="20%" colspan="4" align="left">Student ID: <input type="text" name="studentid" id="studentid" /></td> </tr> <tr align="left"> <td width="20%"> Title:<input type="radio" name="Mr." align="right" />Mr.<br /> <input type="radio" name="Mrs." align="right" />Mrs.<br /> <input type="radio" name="Miss" align="right" />Miss<br /> <input type="radio" name="Ms." align="right" />Ms. </td> <td align="left">First Name: <input type="text" name="firstname" id="firstname" /></td> <td align="left">Last Name: <input type="text" name="lastname" id="lastname" /></td> <td></td> </tr> <tr align="left"> <td>Address:<br /><input type="text" name="address" id="address" /></td> </tr> <tr align="left"> <td>City: <input type="text" name="city" id="city" /></td> <td>State: <input type="text" name="state" id="state" /></td> <td>ZIP: <input type="text" name="zip" id="zip" /></td> <td width="20%"></td> </tr> </table> </form> </body> </html> Hi. I know this is fairly simple but havn't found a fix elsewhere. I created this form but can't close it. I'm guessing its to do with the table? Everytime i but a </form> tag in it either wont submit the form or screws up formatting. Any ideas. Thanks. Code: <table width="681" border="0" class="style26">
<tr>
<td colspan="5" valign="middle"><p>My name is:<br>
</p> </td>
</tr>
<tr>
<td width="8" valign="middle"> </td>
<td width="90" valign="middle"><span class="style30">given name(s)<br>
</span></td>
<td width="170" valign="middle">
<form action="lostform.php" method="post" name="form1">
<span id="sprytextfield1">
<label>
<input type="text" name="gname" id="fname">
</label>
</span>
</form> </td>
<td width="67" valign="middle" class="style30">surname</td>
<td width="324" valign="middle"><span class="style30" id="sprytextfield2">
<label>
<input type="text" name="sname" id="sname">
</label>
</span><br></td>
</tr>
<tr>
<td valign="middle"> </td>
<td valign="middle">My email is:</td>
<td colspan="3" valign="middle"><span id="sprytextfield3">
<label>
<input type="text" name="email" id="email">
</label>
<span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br>
<br></td>
</tr>
<tr>
<td colspan="3" valign="middle">My date of purchase was:</td>
<td colspan="2" valign="middle"><span id="spryselect1">
<label>
<select name="day" size="1" id="day">
<option selected>01</option>
<option>02</option>
<option>03</option>
<option>04</option>
<option>05</option>
<option>06</option>
<option>07</option>
<option>08</option>
<option>09</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>
</label>
<span class="selectRequiredMsg">*</span></span> <span id="spryselect2">
<label>
<select name="month2" size="1" id="month">
<option>JAN</option>
<option>FEB</option>
<option>MAR</option>
<option>APR</option>
<option>MAY</option>
<option>JUN</option>
<option>JUL</option>
<option>AUG</option>
<option>SEP</option>
<option>OCT</option>
<option>NOV</option>
<option>DEC</option>
</select>
</label>
<span class="selectRequiredMsg">*</span></span> <span id="spryselect3">
<label>
<select name="year" size="1" id="year">
<option>1998</option>
<option selected>1999</option>
<option>2000</option>
<option>2001</option>
<option>2002</option>
<option>2003</option>
<option>2004</option>
<option>2005</option>
<option>2006</option>
<option>2007</option>
<option>2008</option>
</select>
*</label><span class="selectInvalidMsg"></span> </span><br></td>
</tr>
<tr>
<td colspan="3" valign="middle">My Receipt Number was:</td>
<td colspan="2" valign="middle"><span id="sprytextfield4">
<label>
<input name="rcpt" type="text" id="rcpt" size="10" maxlength="8">
</label>
<span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldMinCharsMsg style32 style32">Invalid: Please check your receipt number</span><span class="textfieldMaxCharsMsg style32 style32">Invalid: Please check your receipt number.</span></span><br></td>
</tr>
<tr>
<td colspan="3" valign="middle"><br>
Other Comments:</td>
<td colspan="2" valign="middle"> </td>
</tr>
<tr>
<td valign="middle"> </td>
<td colspan="4" valign="middle"><span id="sprytextarea1">
<label></label>
<span class="textareaRequiredMsg">A value is required.</span></span> <div align="center">
<textarea name="message" id="message" cols="45" rows="5"></textarea>
</div></td>
</tr>
<tr>
<td> </td>
<td colspan="4"><label>
<input type="submit" name="submit" id="submit" value="Submit">
</form>
<div align="center"></div>
</label></td>
</tr>
</table>
I apologize if this is in the wrong forum. Please move it to the proper location if needed. Here's the situation: I need a page with 2 fixed frames, small top, rest bottom. In the top frame, I need a few form text fields and a submit button. In the bottom frame, I need the information that was typed into the text fields above to populate the bottom frame. Everytime I enter new info and hit submit, I want the information to be added to the bottom frame and to the information that was already added. I'm new to this, but am a quick learner and willing to spend enough time to do this myself with guidance. Thanks at the moment the text is white and the background of the data area in the form is white too meaning people can't see what they type in. can someone please help so that they can see what they are typing in? here's the webpage; http://www.myspace.com/blissneso and here's the code; <BR><BR><form method="post" action="http://www.ymlp.com/subscribe.php?blissneso"> <table border="0"> <tr> <td colspan="2"><img src="http://img404.imageshack.us/img404/9911/tile18gk.jpg" alt="title" /></td> </tr> <tr> <td>Name:</td> <td><input type="text" name="YMLP0" size="20"></td> </tr> <tr> <td>Email:</td> <td><input type="text" name="YMLP1" size="20"></td> </tr> <tr> <td colspan="2">Select your location:</td> </tr> <tr> <td>NSW:</td> <td><input type="checkbox" name="CAT2"></td> </tr> <tr> <td>VIC:</td> <td><input type="checkbox" name="CAT3"></td> </tr> <tr> <td>QLD:</td> <td><input type="checkbox" name="CAT4"></td> </tr> <tr> <td>WA:</td> <td><input type="checkbox" name="CAT5"></td> </tr> <tr> <td>SA:</td> <td><input type="checkbox" name="CAT6"></td> </tr> <tr> <td>TAS:</td> <td><input type="checkbox" name="CAT7"></td> </tr> <tr> <td>ACT:</td> <td><input type="checkbox" name="CAT8"></td> </tr> <tr> <td>NT:</td> <td><input type="checkbox" name="CAT9"></td> </tr> <tr> <td>NEW ZEALAND:</td> <td><input type="checkbox" name="CAT10"></td> </tr> <tr> <td>OTHER COUNTRY:</td> <td><input type="checkbox" name="CAT11"></td> </tr> <tr> <td colspan="2"><input type="submit" value="Submit"></td> </tr> </table> </form> thanks for any help in advance!!! Hi guys, I've been frustrated for awhile trying to fix three of my problems. I just started making a site for myself today, the specific one is http://www.bcsticketsnow.com/rosebowl.html Anyway, I've got three problems, and appreciate any help anyone can offer on any of them: 1. I'm new to frames, and am told to stay clear of it. But I don't know php, so this is the only way I know to make a header, middle and footer on all 20 pages that I'm going to have where I only need to edit one to change all. So I have 3 frames in the frameset, header, mainrosebowl, and footer. I understand that cols="220,*,100" will make the header 220 pixels, the footer 100 px, and the middle part the rest of the window. But I'm trying to figure out a way to have it go deeper than the window. As you can tell, I've got a scroll bar on that middle frame. I want that frame to extend to more than 100% and push the footer below the visible window. So I'm really looking for a big scroll bar for the entire window to scroll down, not a mini scroll bar just for the middle frame. Is this possible? Having the cols add up to only the size of the window isn't what I'm looking for. 2. In the header frame, I've got that drop down menu (says "Bowl Events"). When I put the form in for the drop down menu, it kind of expanded the height of the table. It had less space before in that row of the table with the blue background. When I put the form in there, it kinda messed up the spacing. I essentially want to delete that space below bowl events to make the height of the row of that table like half the size. Any ideas? 3. For that same drop down menu, I'm trying to target each link in that menu to open up a new window (like target="_top"). But putting it after <option value="URL" target=..."> does nothing. Am I supposed to put it in the javascript? Here's what I have now: <script type="text/javascript"> function goToPage(dd) { var ind = dd.selectedIndex; if (ind == 0) { return; } var url = dd.options[ind].value document.location=url; } </script> <form> <select name="eventlist" onChange="goToPage(this); return false;" size="1" style="border: 0; BACKGROUND: navy; COLOR: white; FONT-FAMILY: arial; FONT-SIZE: 15px; font-weight: bold;"> <option value="">Bowl Events</option> <option value="http://www.bcsticketsnow.com/bcschampionship.html" onclick="header.location.href='_top'">BCS Championship</option> <option value="http://www.bcsticketsnow.com/rosebowl.html">2009 Rose Bowl</option> <option value="http://www.bcsticketsnow.com/orangebowl.html">2009 Orange Bowl</option> <option value="http://www.bcsticketsnow.com/fiestabowl.html">2009 Fiesta Bowl</option> <option value="http://www.bcsticketsnow.com/sugarbowl.html">2009 Sugar Bowl</option> <option value="http://www.bcsticketsnow.com/chickfilabowl.html">2009 Chick-Fil-A Bowl</option> <option value="http://www.bcsticketsnow.com/capitalonebowl.html">2009 Capital One Bowl</option> <option value="http://www.bcsticketsnow.com/cottonbowl.html">2009 Cotton Bowl</option> <option value="http://www.bcsticketsnow.com/holidaybowl.html">2009 Holiday Bowl</option> </select></form> Is there any type of tool that will help me change tables to divs. I have found a template I like but it uses tables. Since I do not know much about tables it is confusing. Or lacking a program that will help me maybe someone would explain it to me. Is there a tuterail that will help me. If I am right I should be able to get all this stuff into css. heres the first table. mother of the bride dress discount wedding dress mother of the groom dress Is there any type of tool that will help me change tables to divs. I have found a template I like but it uses tables. Since I do not know much about tables it is confusing. Or lacking a program that will help me maybe someone would explain it to me. Is there a tuterail that will help me. If I am right I should be able to get all this stuff into css. heres the first table. mother of the bride dress discount wedding dresses mother of the groom dresses Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts hi; i want to create something like this http://www.microsoft.com/en/us/default.aspx need to do exactly as in this site how can i do that.... ; any script (when mouse is over needs to change the iframe....) Highlights Latest releases Using your computer I need to do a form submission that assigns values to radio buttons. Basically its a subjective hearing test, like this one. http://www.entnet.org/healthinfo/hea...aring_test.cfm My question is I don't know how to setup the form at the point of submission, so it returns the proper response, dependent on the selected buttons(or score)? Does anyone have a clue? Thanks in advance... I need help writing a form...i know how to do everything but have it sent to my email address. Can somebody give me or help me write a CGI program that will send it to my email address. Thank you very much Hi there - I tried searching for the answer to thsi question all over the web and have been unable to find the answer so I hope that someone here can help me. I have made a simple form that emails the results to me. However, once submitted the page stays stagnant. It doesnt go anywhere. Once submitted, I would like it to go to another page - like a thank you page. Here is the page: http://www.lillypad.net/content/article.html/1298177 Here is the code I am using: <form action="MAILTO:charbennett@gmail.com" method="post" enctype="text/plain"> <h3>Home Auctions Information. Please fill out the form below and it will be emailed to an agent. You will be contacted within 24 hours </h3> <br> First name: <input type="text" name="firstname" size="40"> <br> Last name: <input type="text" name="lastname" size="40"> <br> Address 1: <input type="text" name="address1" size="40"> <br> Address 2: <input type="text" name="address2" size="40"> <br> City: <input type="text" name="city"> <br> State: State: <select name="state"> <option value="AL">ALABAMA</option> <option value="AK">ALASKA</option> <option value="AZ">ARIZONA</option> <option value="AR">ARKANSAS</option> <option value="CA">CALIFORNIA</option> <option value="CO">COLORADO</option> <option value="CT">CONNECTICUT</option> <option value="DE">DELEWARE</option> <option value="DC">DISTRICT OF COLUMBIA</option> <option value="FL">FLORIDA</option> <option value="GA">GEORGIA</option> <option value="HI">HAWAII</option> <option value="ID">IDAHO</option> <option value="IL">ILLINOIS</option> <option value="IN">INDIANA</option> <option value="IA">IOWA</option> <option value="KS">KANSAS</option> <option value="KY">KENTUCKY</option> <option value="LA">LOUISIANA</option> <option value="ME">MAINE</option> <option value="MD">MARYLAND</option> <option value="MA">MASSACHUSETTS</option> <option value="MI">MICHIGAN</option> <option value="MN">MINNESOTA</option> <option value="MS">MISSISSIPPI</option> <option value="MO">MISSOURI</option> <option value="MT">MONTANA</option> <option value="NE">NEBRASKA</option> <option value="NV">NEVADA</option> <option value="NH">NEW HAMPSHIRE</option> <option value="NJ">NEW JERSEY</option> <option value="NM">NEW MEXICO</option> <option value="NY">NEW YORK</option> <option value="NC">NORTH CAROLINA</option> <option value="ND">NORTH DAKOTA</option> <option value="OH">OHIO</option> <option value="OK">OKLAHOMA</option> <option value="OR">OREGON</option> <option value="PA">PENNSYLVANIA</option> <option value="RI">RHODE ISLAND</option> <option value="SC">SOUTH CAROLINA</option> <option value="SD">SOUTH DAKOTA</option> <option value="TN">TENNESSEE</option> <option value="TX">TEXAS</option> <option value="UT">UTAH</option> <option value="VT">VERMONT</option> <option value="VA">VIRGINIA</option> <option value="WA">WASHINGTON</option> <option value="WV">WEST VIRGINIA</option> <option value="WI">WISCONSIN</option> <option value="WY">WYOMING</option> </select> <br> Phone 1: <input type="text" name="Phone1"> <br> Phone 2: <input type="text" name="Phone2"> <br> <center> Tell us a little about the home you are selling </center> <br> For Sale Address 1: <input type="text" name="forsaleaddress1" size="40"> <br> For Sale Address 2: <input type="text" name="forsaleaddress2" size="40"> <br> City: <input type="text" name="city"> <br> State: <select name="state"> <option value="AL">ALABAMA</option> <option value="AK">ALASKA</option> <option value="AZ">ARIZONA</option> <option value="AR">ARKANSAS</option> <option value="CA">CALIFORNIA</option> <option value="CO">COLORADO</option> <option value="CT">CONNECTICUT</option> <option value="DE">DELEWARE</option> <option value="DC">DISTRICT OF COLUMBIA</option> <option value="FL">FLORIDA</option> <option value="GA">GEORGIA</option> <option value="HI">HAWAII</option> <option value="ID">IDAHO</option> <option value="IL">ILLINOIS</option> <option value="IN">INDIANA</option> <option value="IA">IOWA</option> <option value="KS">KANSAS</option> <option value="KY">KENTUCKY</option> <option value="LA">LOUISIANA</option> <option value="ME">MAINE</option> <option value="MD">MARYLAND</option> <option value="MA">MASSACHUSETTS</option> <option value="MI">MICHIGAN</option> <option value="MN">MINNESOTA</option> <option value="MS">MISSISSIPPI</option> <option value="MO">MISSOURI</option> <option value="MT">MONTANA</option> <option value="NE">NEBRASKA</option> <option value="NV">NEVADA</option> <option value="NH">NEW HAMPSHIRE</option> <option value="NJ">NEW JERSEY</option> <option value="NM">NEW MEXICO</option> <option value="NY">NEW YORK</option> <option value="NC">NORTH CAROLINA</option> <option value="ND">NORTH DAKOTA</option> <option value="OH">OHIO</option> <option value="OK">OKLAHOMA</option> <option value="OR">OREGON</option> <option value="PA">PENNSYLVANIA</option> <option value="RI">RHODE ISLAND</option> <option value="SC">SOUTH CAROLINA</option> <option value="SD">SOUTH DAKOTA</option> <option value="TN">TENNESSEE</option> <option value="TX">TEXAS</option> <option value="UT">UTAH</option> <option value="VT">VERMONT</option> <option value="VA">VIRGINIA</option> <option value="WA">WASHINGTON</option> <option value="WV">WEST VIRGINIA</option> <option value="WI">WISCONSIN</option> <option value="WY">WYOMING</option> </select> <br> Asking Price: <input type="text" name="askingprice"> <br> Number of Bedrooms: <select name="numberofbedrooms"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6+">6+</option> </select> <br> Number of Full Baths: <select name="numberoffullbaths"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6+">6+</option> </select> <br> Number of Half Baths: <select name="numberofhalfbaths"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6+">6+</option> </select> <br> Approximate Square Footage: <input type="text" name="squarefootage" size="5"> <br> Acreage: <input type="text" name="acreage"> <br> Additional Comments about Home:<br> <Input type="text" name="comments" size="40"> <br>Please add additional information you want us to know about your home here - limit 500 characters. <br><br> <input type="submit" value="Send"> <input type="reset" value="Reset"> </form> Here is the link I would like it to go to after they submit the form: http://lillypad.net/content/featured...uredproperty=1 Thank you for any help you can give! Sincerely, Char Hi can anyone help me I set up a website for a friend and added a form so clients could fill it in and make appointments. For some reason it doesn't seem to work properly. It works from my partners laptop and the main pc but on my laptop nothing happens , after clicking submit the form does not send . I have tried sending it with outlook express open and it still does jot work from laptop The html code is spot on and correct Anyone got any ideas I need help with a form that allows the user to enter and submit the information, and then that information that they enter is automatically dislplayed below on the same page, after they hit the submit button. Here is the code I have. Here is the html code (comment.html) <html> <body> <form action="post.php" method="post"> First Name: <input type ="text" name="firstname"/>   Last Name: <input type ="text" name="lastname"/> <br/> <br/><dd/> Comments orSuggestions: <br/><dd/> <textarea name="comment" rows="10" cols="50"></textarea> </textarea> </form> </body> </html> Here is the php code (post.php) <?php $firstname=$_GET['firstname']; $lastname=$_GET['lastname']; $comment=$_GET['comment']; echo $firstname; echo "&4nbsp; $lastname"; echo ":"; echo " $comment"; ?> I do not want the the info when submitted to be displayed on the php page, I want it displayed on the html page where it was submitted, I was told I needed a php page to do that, but I cannot get it to work. please help i am new to html and i am trying to add an optin form to my site that is linked to my e-mail can anyone help also the email address that the info needs to be sent to is glenwalker@grabtwitter.co.uk Hi, I'm looking for some coding to start a small app that allows the filling of a form in order to submit my free 30 sms that i have montly from my operator. The manual procedure is 1) Login (by cookie or Session) 2) In the page, select SMS 3) Select a category (varies) 4) Write the message & Press Submit 5) Logout What i'm looking for is an app, JS/HTML/PHP/ASP/ETC that could bring the manual procedure described above in one simple form. I am creating some forms for a website, and each form needs to have 1 or 2 text fields that can have additional text fields added or removed from the form. For example, a plus sign that would duplicate the text field, and then a minus sign to get rid of excess fields. I would really appreciate it! If you need more information on my problem stvnclerico@gmail.com Thankyou! Can somebody suggest a site where a can download an easy script to make my form work so that I can get it to my email? Thanks Okay, I'm trying to make a form that sends the information entered to my email address. I don't know if it's the code or not but all it seems to be doing is opening up a blank email directed to the address. Here's the code: <form action="MAILTO:lifeisbetteroutsidethebox@hotmail.com" method="post" enctype="text/plain"> <p align="center"><strong>Your Full Name:</strong><br /><input name="name" type="text" class="style8" size="20"> </p> <p align="center"><strong>Your Email Address:</strong><br /> <input name="mail" type="text" class="style8" size="20" /> </p> <p align="center"><strong>Your City:</strong><br /> <input name="city" type="text" class="style8" size="20" /> <p align="center"> <input name="Send" type="submit" id="Send" value="Send"> <input name="Reset" type="reset" id="Reset" value="Reset"> </form> Okay, any help please? |
|||||||