It is important to remember that the purpose of forms is to collect information from users. Of course,
this information has some further purpose, usually involving processing the submitted information in
manipulation of the data, the bulk of processing activity takes place on the server, using a
server-based programming language.
The manner in which server-based processing takes place is important to understand when designing forms.
Although you will not be learning form processing here, you need a general understanding of how the server
identifies form information submitted to it.
When a submit button or submit image is clicked, information from the form is packaged for delivery
to the page identified in the action attribute of the
<form> tag. When forms are
submitted to a Web server, this information is transmitted by the method indicated, which can be
either get or post. Usually, form information is submitted to the server using the post method,
meaning that it arrives at the server in a separate data stream from the URL request. When the
information arrives, it is made available to the URL page and its processing script.
Form information is identified and processed at the server through names and values.
Each field on a form is assigned a name when the form is created. This unique identifier is used to
reference that particular form control and the value associated with it. When information is typed
into a textbox, for example, that text becomes the value of the control and can be referenced through
the name assigned to the textbox. Likewise, when the user clicks on a checkbox or selects from a
drop-down list, the data value associated with the checkbox or selection choice is referenced
through the name assigned to that particular control.
Thus, form information ends up as field names and associated data values submitted by the user.
Information arrives at the processing page as a string of name/value pairs in the format:
Control names and their associated values are paired with an equal sign (=) and are connected with
other pairs of names and values by ampersands (&). One of the first tasks of a processing
script is to parse this string of characters into separate names and values in
order to extract the information entered into the form. Thereafter, the script manipulates the
information according to whatever processing steps are necessary.
A Form Example
The following form does not include all the possible field types, but it does illustrate the approach
to creating a simple form.
Membership Application Form
Figure 10-43. A data entry form.
The form elements have been coded inside a table structure to help align the labels and fields.
You should recognize all of the form controls in the following code listing.
<form name="MyForm" action="MembershipForm.htm" method="post">
<h2>Membership Application Form
<td><input type="text" name="FirstName" size="15" maxlength="15"/></td>
<td><input type="text" name="LastName" size="15" maxlength="15"/></td>
<td><input type="text" name="Email" size="30" maxlength="50"/></td>
<td><input type="radio" name="Gender" value="F"/>Female
<input type="radio" name="Gender" value="M"/>Male
<td><textarea name="Reason" cols="30" rows="5"></textarea></td>
<td><input type="submit" name="SubmitButton" value="Submit Form"/></td>
Listing 11-24. Code for a data entry form.
The action attribute of the
<form> tag is the MembershipForm.htm page. That is,
information submitted from the form is made available to this page when it is transmitted to the
server. The method is post, meaning that form name/value pairs are sent as a separate data stream
to the URL specified in the actionattribute. The entire set of name/value pairs for the filled-out
form would resemble the following:
Note that blank spaces in the string are replaced by the plus sign (+).
If the get method is used, the entire set of name/value pairs for the filled-out form would be
appended as a query string and passed to the URL specified in the actionattribute as shown below:
When this input string is received at the server, it is broken down into its component parts so that
individual names and values are associated:
Reason=To meet new friends and make Web pages
The manner in which this information is processed by the receiving page depends on the script
contained on that page.
Form submission data is typically processed by a client-side script, server-side script, or a
without having the data passed to a web server for processing. Client-side scripts are faster and
generally used to validate form input data.
Server-side scripting is a technology by which a script is run on a web server to dynamically generate
and process web pages and form input. Common server-side scripting technologies include PHP, Ruby on
Rails, Microsoft's ASP.NET, Adobe Coldfusion, and Java. Since server-side scripts are run on the
web-server, these scripts have the ability to interactive with databases and file handling.
In most web applications, form data is first processed by a client-side script for the purpose of
data validation and page customization. Next, the data is passed on to a server-side script where
another level of data validation occurs followed by the data being written to a database.