Forms

In order for forms to work properly there needs to be code that exists on the server tot recieve the output from the forms as well as html code within the page viewed on the browser. Since we don't have the server side code, our forms will probably do some unexpected things.

Tags and Attributes

Tag	Attribute
<form></form>	Begins and ends a form.
<input>	Manages the "control" attribute that will be used with the form. Attribute Use Type="x" Specifies the type of control being used. Possible values are:text, password, checkbox, radio, submit, reset, file, hidden, image, button. name="x" Names the control. value="x" describes the input control. size="x" width of the control in pixels unless the control size is automatically dictated by the length of text in the control. maxlength="x" Maximum number of characters allowed in the input control. checked="x" Preselects a radio button or checkbox. src="x" Determines the location of a graphical item to be used as a button within the form.
<textarea></textarea>	Creates a text input area. Attributes are "rows=x" where x is the number of rows for the input area and "cols="x" where x is the number of columns for the input area.
<select></select>	Creates either a drop down or text list menu. The attribute "multiple" may be added if you want the site visitor to be able to select more than one item.
<option></option>	Defines each list item within a menu.

Examples

The Bare Minimum
All forms will probably have the following items in one way or another.

<form method="post" action"mailto:rickmudd@lycos.com">

</form>

<form method="post" action="mailto:rickmudd@lycos.com">

First Name:<input type="text" name="firstname" size="25" maxlength="50">

</form>

looks like this:

Getting more complicated...

<form method="post" action="mailto:rickmudd@lycos.com">

First Name:<input type="text" name="firstname" size="25" maxlength="50">
<br>
Last Name:<input type="text" name="lastname" size="25" maxlength="50">

</form>

looks like this:

<form method="post" action="mailto:rickmudd@lycos.com">

First Name:<input type="text" name="firstname" size="25" maxlength="50">
<br>
Last Name:<input type="text" name="lastname" size="25" maxlength="50">

<p> Age:
<br> 12 to 15 <input type="checkbox" name="12to15">
<br> 16 to 19 <input type="checkbox" name="16to19">
<br> 20 to 23 <input type="checkbox" name="20to23">
<p>
</form>

looks like this:

<form method="post" action="mailto:rickmudd@lycos.com">

First Name:<input type="text" name="firstname" size="25" maxlength="50">
<br>
Last Name:<input type="text" name="lastname" size="25" maxlength="50">

<p> Age
<br> 12 to 15 <input type="checkbox" name="12to15">
<br> 16 to 19 <input type="checkbox" name="16to19">
<br> 20 to 23 <input type="checkbox" name="20to23">
<p>

Year:
<br>
<input type="radio" name="button" value="freshman">Freshman<br>
<input type="radio" name="button" value="sophmore">Sophmore<br>
<input type="radio" name="button" value="junior">Junior<br>
<input type="radio" name="button" value="senior">Senior<br>
</form>

looks like this:

<form method="post" action="mailto:rickmudd@lycos.com">

First Name:<input type="text" name="firstname" size="25" maxlength="50">
<br>
Last Name:<input type="text" name="lastname" size="25" maxlength="50">

<p> Age
<br> 12 to 15 <input type="checkbox" name="12to15">
<br> 16 to 19 <input type="checkbox" name="16to19">
<br> 20 to 23 <input type="checkbox" name="20to23">
<p>

Year:
<br>
<input type="radio" name="button" value="freshman">Freshman<br>
<input type="radio" name="button" value="sophmore">Sophmore<br>
<input type="radio" name="button" value="junior">Junior<br>
<input type="radio" name="button" value="senior">Senior<br>

Lunch
<br>

<select name="lunch" size="1">
<option value="Twinkies" selected>Twinkies</option>
<option value="Potato Chips" selected>Potato Chips</option>
<option value="Fries" selected>Fries</option>
<option value="All Three" selected>All Three</option>
</select>
</form>

looks like this:

<form method="post" action="mailto:rickmudd@lycos.com">

First Name:<input type="text" name="firstname" size="25" maxlength="50">
<br>
Last Name:<input type="text" name="lastname" size="25" maxlength="50">

<p> Age
<br> 12 to 15 <input type="checkbox" name="12to15">
<br> 16 to 19 <input type="checkbox" name="16to19">
<br> 20 to 23 <input type="checkbox" name="20to23">
<p>

Year:
<br>
<input type="radio" name="button" value="freshman">Freshman<br>
<input type="radio" name="button" value="sophmore">Sophmore<br>
<input type="radio" name="button" value="junior">Junior<br>
<input type="radio" name="button" value="senior">Senior<br>

Lunch
<br>

<select name="lunch" size="1">
<option value="Twinkies" selected>Twinkies</option>
<option value="Potato Chips" selected>Potato Chips</option>
<option value="Fries" selected>Fries</option>
<option value="All Three" selected>All Three</option>
</select>

Buttons!
<br>
<input type="submit" value="Submit" name ="submit">
<input type="Resett" value="Clear the Form!" name ="reset">
</form>

looks like this: