Site hosted by Angelfire.com: Build your free website today!

Form Elements

Forms gather information and return it to you. They are easy to make, but take some time. There are a variety of types of ways to ask for information. these include:

RADIO BUTTON choice 1
choice 2
choice 3
forces a single choice to be selected
CHECKBOX choice 1
choice 2
choice 3
allows multiple choices to be selected
POP-UP LIST (SELECTION LIST) allows single option but in a pop-up list format; a single option shows at any one time (top option is what is shown as default)
TEXT BOX forces user to type in a SINGLE line of information; can be given a specific size (length)
TEXT AREA allows user to type in multiple lines of information (area scrolls if needed); can be given a size in terms of length (# of columns) and height (# of rows).
SUBMIT BUTTON sends the chosen responses to be processed
CLEAR BUTTON erases all choices made on the form to reset the form

To make forms visually attractive, you should use tables to align text and selection options.

Forms need a SUBMIT button, and should include a RESET or CLEAR button.

To e-mail form information to yourself and put it in a format so you can read it easily, type the following into the <FORM> tag at the top of the form:

<FORM method="post" action="mailto:youremailname@youremaillocation" enctype="text/plain">

The action=mailto part emails the information to you; the enctype="text/plain" unscrambles the raw responses and puts the identifying information of the items and the responses into a series of lines; each item response will appear on a single line.

The code for the form elements is shown here:

input type refers to the type of element: a radio button, checkbox, textbox, etc. It remains the same for EACH option in that item.
name refers to the specific item on the form; for example, all options for question 1 would have the name "Q1" or something that makes sense to you.
value shows the text of the option chosen by the person filling out the form. Notice it changes for EACH option.
RADIO BUTTON choice 1
choice 2
choice 3
<input type="radio" value="choice 1" name="radioinput">choice 1<BR>
<input type="radio" value="choice 2" name="radioinput">choice 2<BR>
<input type="radio" value="choice 3" name="radioinput">choice 3
CHECKBOX choice 1
choice 2
choice 3
<input type="checkbox" value="checkbox 1" name="checkboxinput">choice 1<BR>
<input type="checkbox" value="checkbox 2" name="checkboxinput">choice 2<BR>
<input type="checkbox" value="checkbox 3" name="checkboxinput">choice 3<BR>
POP-UP LIST (SELECTION LIST) <select name="popupinput">
<option>option 1
<option>option 2
<option>option 3
<option>option 4
<option>option 5
</select>
TEXT BOX <input type="text" name="textboxinput" size="20">
TEXT AREA <textarea name="textareainput" cols="20" rows="4"> </textarea>
SUBMIT BUTTON <input type="submit" value="send my responses">
CLEAR BUTTON <input type="reset" value="clear my responses" name="reset">
Sample download of a Microsoft Word file.