Forms

A form is an area that can contain form elements. Form elements are elements that allow the user to enter information (like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.) in a form.

Below is an example source code for an html page using FORM to collect visitors' names, emails and messages:

<HTML>
<HEAD>
<TITLE>Guest Book</TITLE>
</HEAD>
<BODY>
<FORM METHOD="post" ACTION="guest_book.cgi"> <P/>
name: <INPUT TYPE="text" NAME="name" SIZE="20"/> <P/>
email: <INPUT TYPE="text" NAME="email" SIZE="30"/> <P/>
message: <BR/>
<TEXTAREA NAME="message" COLS=30 ROWS=4>Please leave a message here </TEXTAREA><P/>
<INPUT TYPE="submit" VALUE="submit"/> <INPUT TYPE="reset" VALUE="reset"/>
</FORM>
</BODY>
</HTML>

A form is defined with the <FORM> tag.

ACTION="/guestbook/guest-book.cgi" tells which .cgi executable to call upon the data submission.

TARGET attribute can be used to specify how to display the result webpage from the .cgi executable.

METHOD="post" tells the way to send the input data. It means sending the data in the body of the http request, and the script get the input string from standard I/O stream.

Its alternative, METHOD="get", sends the form contents in the URL: URL?name=value&name=value. It is the default method but doesn't support values containing non-ASCII characters or exceeds 100 characters.

<INPUT ... /> tag is the used form tag. The attribute NAME defines the name of the variable. The type of input is specified with the TYPE attribute. There are many types available with additional attributes such as SIZE. We used only text here, and you can find more types here if you are interested.

<TEXTAREA> defines a text-area (a multi-line text input control). It has a COLS and a ROWS attribute defining the size of the text-area, where visitors can write their messages. In a text-area you can write an unlimited number of characters. A scroll bar is going to appear if you exceed the number of rows. Note that we used METHOD="post" in the form, because a visitor message is likely to exceed 100 characters

Now give it a try. Create an html file called guest_book.html, copy and hook it with the navigation bar we just created and check it out with your web browser.

Next step: we will see how a perl script processing the visitor input.