Web Page Design Boot Camp

  Home |  Basics |  Intermediate |  Advanced |  Tools |  Site Map    Subtopics:

Using Forms

Forms provide a way to collect data that can be returned by the browser to the web server, which will then process it. With the growth of electronic commerce and information retrieval services, forms are being used more widely. For instance, you use a form when specifying a search criterion at any Internet search engine. They are also used in online ordering systems where you must select items you wish to purchase and the quantity, identify the kind of credit card, and so on.

In addition to collecting data for server-side processing, forms can be used web site navigation. To the right of the navigation bar at the top of this page is a form consisting of a single list box. Select an item from the list and the browser will go to that page of the tutorial. This provides a much more compact way to make a large number of links available without cluttering the web page with a bunch of anchor tags. Another use of forms is to insert a button that closes a page or sends the browser to the previous page as though you had clicked on the browser's  Back  button.

<form name="addrform" action="/cgi-bin/procform.pl" method=get>
< >
</form>
<form></form>
This pair of tags mark the beginning and end of a form definition.
name
Specifies the name of the form. This can be used by JavaScript routines embedded in the web page to refer to items in the form. It is possible to have more than one form in a web page.
action
Specifies the name of the program on the server that will process the data in the form. In the example given here, it is a program called procform.pl which is stored in the cgi-bin folder.
method
Specifies how the form contents will be sent to the server for processing. The allowed values are get and post. Using the default value of get, the form is appended to the URL of the program that will process it.

Between the <form> and </form> tags you place the form controls used to collect information from the person browsing the page. These controls fall into three categories: text entry, choices, and buttons. Once we've gone over the basic elements of a form, we'll take a look at a form in action with the Automatic Letter Writer.