HTML lets you create forms that allow the user to submit information to a Web server. A form contains input fields where the user can enter information. Forms can also contain checkboxes, radio buttons, and pop-up menus for selecting items from option lists. Most forms also have some action buttons, typically Submit and Reset buttons.
There are several types of form input, for example:
Each of these inputs works differently.
When a client program submits a form, it can use either the GET or the POST method. The query string in the GET method or the body of the request message in the POST method contains the data entered into the form by the user. As the form writer, you need to decode the information that is returned to make use of it.
You can have anything inside a form except another form.
Note that forms are not visually separated from the rest of a document. You can visually separate a form by using the <HR> (horizontal rule) tag before and after the form.
|
| For more information about forms, see the sample scripts provided with Purveyor. For more information, see Appendix A in the programmer’s guide. |
Markup tags associated with fill-in-forms can be classified into subgroups:
The <FORM> tag specifies a fill-out form within an HTML document. You can have more than one fill-out form in a document but you cannot nest forms. You define each form by using starting and ending tags. You use attributes to specify how the server or program should process the forms input.
The form needs to know how to send the information to the server. Two methods are available: GET and POST. The form also needs to know where to send the information. This is the URL being requested from the form, and is referenced with the ACTION tag. This URL almost always points to a CGI program to decode the form results.
The attributes are as follows:
The <INPUT> tag specifies a simple input element inside a form. It is a standalone tag, does not surround anything, and there is no terminating tag.
The attributes are as follows:
The <SELECT> tag specifies menus and scrollable lists. There is a closing </SELECT> tag. Inside the tags, only the <OPTION> tag is allowed. For example:
<SELECT NAME="a-menu">
<OPTION> First option.
<OPTION> Second option.
</SELECT>
The attributes for SELECT are as follows:
There is only one <OPTION> tag attribute:
The <TEXTAREA> tag specifies a multiline text entry field. There is a closing </TEXTAREA> tag. Text areas automatically have scroll bars; any amount of text can be entered into them. Enter any default text for the area after the <TEXTAREA> and before the </TEXTAREA> tags. Any specified carriage returns in the default text are respected (unlike most HTML coding).
The attributes are as follows:
Figure 23 is an example of a form defined in HTML.
Figure 23 Form Tags in HTML Document
Field 1 (text entry field) <input type="text" name="field1"> <p>
Field 2 (checkbox) <input type="checkbox"
name="field2">
<p>
Field 3 (radio buttons)<BR>
<input type="radio" name=field3 value="Neuter">
Neuter<BR>
<p>
Field 4 (select)
<select name="field4">
<option> First
<option> Second
<option> Third
<option> Fourth
</select>
<p>
Field 5 (textarea) <textarea
name=field5 rows=4 cols=40>
</textarea>
<p>
Field 6 (submit) <input type="submit"
value="Go">
</form>
</body>
The action attribute of the form is the URL of the script, and (in this example) the method attribute is POST.
If the action attribute of the example form is changed to:
http://host.domain.edu/scripts/egscript.exe/foo/bar
then the script program scripts/egscript.exe is still executed. The /foo/bar part is passed to the script in the PATH_INFO environment variable.
There are two methods for accessing information users submitted on forms: GET and POST. Depending on which one you specified as your method, you receive the information in different ways.
For more information on decoding forms
with CGI programs, access the URL:
http://hoohoo.ncsa.uiuc.edu/cgi/forms.html.
When the submit button is selected, the contents of the form are assembled and the query URL looks like this:
action?name=value&name=value&name=value...
action is the specified action from the <FORM> tag, or the current document’s URL if no action was specified. The name=value pairs are the symbolic names and values for the elements (text entry, radio, and checkbox areas).
For text and password entry fields, whatever the user typed in is the value, if the user did not type anything, the value is empty, but the name= part of the query string is still present.
Your CGI program receives the encoded form in the environment variable QUERY_STRING.
For checkboxes and radio buttons, the VALUE attribute specifies the value of a selected radio button or checkbox. An unchecked box is disregarded completely when assembling the query string.
Multiple checkboxes can have the same NAME (and different VALUEs). Multiple radio buttons intended to have "one of many" behavior should have the same NAME and different VALUEs.
If the method was POST, the string is sent in a data block.
name=value&name=value&name=value...
where the name=value pairs are the symbolic names and values for the elements (text entry, radio, and checkbox areas).
Your CGI program receives the encoded form on standard input. The server does not send an EOF; you need to use the environment variable CONTENT_LENGTH to determine how much data you should read from standard input.
Each name=value pair is separated by an ampersand (&). Each pair is URL encoded, that is, spaces are changed to plusses (+) and some characters are encoded into hexadecimal (for example, & and =).
The basic procedure is to split the data by the ampersands. For each name=value pair you get, URL decode the name, then the value, and then do what you want to with them.
HTML lets you create forms that allow users to submit information (such as a complex database query) to a Web Server.
When a client program submits a form, it may use either the GET or POST method. If the client program uses the GET method, the query string contains the data entered into the form by the user. If the client program uses POST, the body of the request message contains the user-entered data.
A full description of how to create forms can be found at:
http://www.ncsa.uiuc.edu/SDG/Software/Mosaic/Docs/fill-out-forms/overview.html
