Form Tools
This form is a sample of various tools that may be used when creating forms:
Single text entry field
Code:
Name: <INPUT SIZE=40 NAME="field1">
<INPUT TYPE="HIDDEN" NAME="name1" VALUE="Name">
Result:
Name:
Note: The SIZE=40 attribute is optional. Leaving a SIZE out, however, allows the user to enter as much information as they want, into millions of characters.
Password Protection
Code:
Enter your password: <INPUT TYPE="password" NAME="password" VALUE="new_user">
Result:
Enter your password:
Multi Line Text Entry
Code:
Your comments here:
<TEXTAREA NAME="Comments" ROWS="5" COLS="60">You type in here </TEXTAREA>
<INPUT TYPE="HIDDEN" NAME="Comments" VALUE="Comments">
Result:
Your comments here:
You type in here
Check Boxes
Code:
Select the additional items you with to have installed:
<INPUT TYPE="CHECKBOX" NAME="OptionPreferred" VALUE="Option1"> Additional Item 1
<INPUT TYPE="CHECKBOX" NAME="OptionPreferred" VALUE="Option2"> Additional Item 2
<INPUT TYPE="CHECKBOX" NAME="OptionPreferred" VALUE="Option3"> Additional Item 3
<INPUT TYPE="HIDDEN" NAME="field3" value="Additional_Items">
Result:
Select the additional items you with to have installed:
Additional Item 1
Additional Item 2
Additional Item 3
Toggle or Radio Buttons
Code:
Choose one of the following:
<INPUT TYPE="RADIO" NAME="ChooseOne" VALUE="Choice1"> Choice 1
<INPUT TYPE="RADIO" NAME="ChooseOne" VALUE="Choice2"> Choice 2
<INPUT TYPE="RADIO" NAME="ChooseOne" VALUE="Choice3"> Choice 3
<INPUT TYPE="HIDDEN" NAME="field4" VALUE="PickOne">
Result:
Select the additional items you with to have installed:
Choice 1
Choice 2
Choice 3
Option Menus
Code:
What was the shape?: <SELECT NAME="field 5">
<OPTION SELECTED VALUE="Sphere">Sphere
<OPTION VALUE="Cube">Cube
<OPTION VALUE="Cone">Cone
<OPTION VALUE="Cylinder">Cylinder
</SELECT>
<INPUT TYPE="HIDDEN" NAME="name5" VALUE="Shape">
Result:
What was the shape?:
Sphere
Cube
Cone
Cylinder
Note: The SELECTED attribute is optional.
Scrolling selection lists
Code:
What was the color?
(Use the <I>Control</I> or <I>Command</I> key to select more than one):
<SELECT NAME="field 6" MULTIPLE SIZE=5>
<OPTION VALUE="Red">Red
<OPTION VALUE="Orange">Orange
<OPTION VALUE="Yellow">Yellow
<OPTION VALUE="Green">Green
<OPTION VALUE="Blue">Blue
<OPTION VALUE="Purple">Purple
<OPTION VALUE="Copper">Copper
<OPTION VALUE="Silver">Silver
<OPTION VALUE="Gold">Gold
<OPTION VALUE="White">White
<OPTION VALUE="Gray">Gray
<OPTION VALUE="Black">Black
</SELECT>
<INPUT TYPE="HIDDEN" NAME="name6" VALUE="Shape">
Result:
What was the color?:
(Use the
Control
or
Command
key to select more than one):
Red
Orange
Yellow
Green
Blue
Purple
Copper
Silver
Gold
White
Gray
Black
Submitting The Form
Code:
Please be certain all information is complete before you <INPUT TYPE="submit" VALUE="Submit the order">.
To reset the form and start over, you can <INPUT TYPE="reset" VALUE="Clear Form">.
Result:
Please be certain all information is complete before you
.
To reset the form and start over, you can
or just go
back
.
©Ken Kaleta 1997, 1998, 1999