Forms

Javascript
The Tools
Promoting the page
Making Money
Contact Me

Forms are a way to get information from visitors to your page. Their are only four different tags that make up forms:

<form>
<input>
<select>
<option>
<textarea>

Every form is started by <form> and ended by </form>. <Form> usually takes two attributes, action and method. The action is either the full pathname of the script you are using (you need to find out from your ISP what the script is called) or a mailto link. (<A href="mailto:your@email">). The CGI script is prefered, since mailto doesn't work with all browsers. Method is almost always post, but it can occasionally be get, you need to check with your ISP again.

Now, to allow the user to enter information, we use the <input> tag. Input takes the attribute Type. Type has many options:

type="text" and type="password" accept text entries.
type="checkbox" gives the user a box that can be either checked or unchecked.
type="radio" makes a group of radio buttons that only let you have one of the buttons selected. (they must have the same name)
type="submit" creates a button that sends the information to the form action.
type="reset" creates a button that clears the form.
type="file" creates a text box for uploading files. The user can either type in the filename, or use the browse button. This only works with Netscape.
Their are others, image and hidden, that are rarely used.

Name is how you tell the different parts of the form apart when you recieve the information.

Value is another attribute of <input>. For type="text" or type="password" value is the default text in the box. For type="checkbox" or type="radio", it is the value sent to you if that box is checked. For type="submit" or type="reset" it is the text that appears on the buttons.

The other attributes of <input> are as follows:

size="width" where width is the number of characters in a text field.
maxlength="length" where length is the maximum number of characters allowed.

So, from what we know so far, we can create a simple form. Using tables makes forms look much better:

Your name:
Your sex:	Your interests:
Male:	Computers:
Female:	Sports:
	Television:

The source for this looks very long, but it's the tables, not the form itself.

<Table>
<TR>
<TD>Your name:</TD>
<TD><input type="text" width=50 name="first name"></TD>
</TR>
<TR><TD>Your sex:</TD>
<TD>Your interests:</TD>
<TR><TD> <input type="radio" name="sex" value="Male">Male:</TD>
<TD> <input type="checkbox" value="computers" name="computers">Computers:</TD>
</TR>
<TR>
<TD> <input type="radio" name="sex" value="female">Female:
</TD>
 <TD><input type="checkbox" value="sports" name="sports"> Sports: 
</TD>
<TR>
<TD></TD>
<TD>
 <input type="checkbox" name="TV" value="TV">Television:</TD>
</TR>
<TR>
<TD><input type="submit" value="send it"</TD>
<TD><input type="reset" value="reset"></TD>
</TR>
</FORM>
</Table>

Their are only a few more elements of forms, and these aren't used nearly as much.

<SELECT> lets you define a list of options. This also takes the name and size attributes. It also takes the multiple attribute, which lets you select more than one option.

<OPTION> is used between <SELECT> and </SELECT>. It defines that options you can pick. You can use the attribute selected with <option> to pick the default value. Here's an example:

Which is done like this:

<FORM action="mailto:tkeer@cvn.net" method="post">
<Select multiple>
<option>Football
<option selected>Basketball
<option>Hockey
</Select>
</FORM>

The last form tag is <textarea>. It takes the name attribute and also takes rows="number_rows" and cols="number_columns". Both take a number that represent the number of lines or characters in the textarea.

That's all their is to know about forms.

Mail me at tkeer@cvn.net