Forms

Forms provide a means of making interactive web pages.  Users can enter data into a form via their browser and have it sent to a program through CGI.

Forms include many graphical widgets for data entry (text fields, radio buttons, pull downs, etc).

When a user is done filling out a form, she clicks a special submit button which causes the browser to bundle up the input data and send it to the web server (and from there to a program through CGI).

Notice that the browser doesn't/can't do anything with the data besides bundle it up and send it off.

The <form> tag

Can be placed anywhere in the document, more than one per document.

Formatting within a form is up to you; standard HTML stuff applies.

Two very important attributes must be supplied:

The type of encoding is the algorithm for encoding the data so that it is safe to append to a URL.  The standard for this is: The alternative encoding strategy is to send each form element in a separate section with a field separator that looks like (30 dashes and a big random number)

GET method

POST method

Since your CGI program doesn't control whether data is sent to it via GET or POST, it is most robust to program for both possibilities.

Input elements

<input> tag used for all types of inputs.  Important attributes are:

Action buttons

These buttons have an immediate effect. For example will send the data from the form to the CGI program (specified in action attribute of form tag) when clicked. And clears all the input fields of data.

Action buttons are also used for image buttons.

Hidden fields

Hidden fields are input elements which don't show up and the user can't change the value of.  Handy for keeping track of input according to user, or knowing what the form is.

Textareas

The <textarea> tag allows for free-form input (multiple lines) from a user.  Handy for leaving comments, say.

Selection

The <select> tag is used when you want a scrolling list of options.

<select name="operating system" size=2 multiple>
 <option>HP-UX
 <option>NEXTSTEP
 <option>Win NT
</select>

The size attribute determines how many choices are visible at one time if multiple is used.