HOME PC Alamode About Us HELP
Reviews Columns Features Archives Other  


 The Lazy Webmaster

Forms
November 2004

Susan Ives

Susan Ives is a past-president and past-webmaster of Alamo PC.


If you need to collect standardized information on your Web site, a form is the only way to go. Creating the form itself is easy: the hard part is getting the form data from the browser to your inbox in a usable format.

The container tag for a form is <FORM> </FORM>. Everything listed below fits within that. The first <Form> tag includes variables that tell the browser how to process the form. I’ll save that for last, since that’s the hard part.

There are five kinds of input fields:

Radio buttons: are round circles.

Only one option can be checked in a radio button sequence. Yes OR no OR maybe. Male OR female. Here’s how you would code a couple of radio buttons:

Male Female

<INPUT TYPE="radio" NAME="radio1" VALUE="male">Male
<INPUT TYPE="radio" NAME="radio1" VALUE="female">Female

Checkboxes: are boxes that are checked.

Duh. Every checkbox is independent of the others, so multiple boxes can be checked. Here’s how you would code a couple of check boxes:

South America
Australia

<INPUT TYPE="checkbox" NAME="south">South America
<INPUT TYPE="checkbox" NAME="australia">Australia
 

Drop down lists: can be configured to act either like radio buttons (only one choice) or like check boxes (the user can hold down the CTRL key and select multiple options.) Drop down lists work well for long lists, like selecting your state or country of residence, when a screen full of radio buttons would be overwhelming. Here’s how you would code a drop down list:

<select name="state">
<option value="kansas">Kansas
 <option value="oklahoma">Oklahoma
<option value="texas">Texas
</select>

Text box - fixed length: are small text boxes of a fixed length, good for inputs like e-mail addresses or phone numbers.
Here’s how you would code a text box:

Zip Code 

<INPUT TYPE="text" NAME="zipcode" SIZE="5">

Text box - variable length: is a good way to capture free-form comments. Here’s how you would code a large text box:

Type your petty little complaints here:

<TEXTAREA NAME="request" ROWS="4" COLS="40"></TEXTAREA>

The last thing you need is a submit button. The format for this is:

<INPUT TYPE="SUBMIT" VALUE="Send to Susan">

Now, for the hard part. How do you construct the variables in the <form> tag to get the input into your inbox?

The easiest way is to use the mailto: command. The format for this is:

<FORM ACTION="mailto:yourname@domain.com" METHOD="POST">

Problem:  it doesn’t work with most browsers. When someone tries to submit the form, it just opens a blank e-mail form. Oops. Not good enough. Features that don’t work half the time are not worth implementing.

The most elegant way is to install CGICommon Gateway Interface – files on your server. These files will use the sendmail program on your server to get the data to you. This is complicated. First, you have to have permission from your Web host to install CGI scripts; not all allow it Then you have to figure out how to configure the scripts, including adding obscure paths for the data to flow to. Where the heck is Perl: #!/usr/local/bin/perl?

Fortunately, many, if not most, commercial Web hosts not only accept CGI scripts but provide instructions on how to implement them. The host I use for susanives.com - 5dollarhosting.com - provides excellent instructions on how to configure CGI scripts. All that for $5 a month.

If you need a form processing script, the most popular one is FormMail. Get it at nms-cgi.sourceforge.net/scripts.shtml. It’s free and comes with extensive installation instructions. The <form> tag will look something like this:

<FORM ACTION="/cgi-bin/formmail.pl" METHOD="POST">

Other Web hosts may pre-install a form CGI script and provide it to you. This is what Yahoo Web hosting does.

If you use Microsoft Front Page and your Web host supports Front Page Extensions, there is a webbot that will automatically configure a form correctly. Refer to the manual or help file for instructions.

There are several other option using ASP (active server pages) and PHP, a server-side scripting language, but they are beyond the scope of this column.

If all of this seems too complicated, you can use an online service to help you create the form using a Web-based interface and process the form once it’s completed. One I like is Response-O-Matic <www.response-o-matic.com/>. It’s easy to use and free, but if you want to get rid of the few small ads you can pay $19.95 for a year of ad-free service.

Other services can be found if you search for “web form processing.”

There are more variables than I have explained here. A good forms tutorial is at speakeasy.org.

You can add even more functions to forms using javascripts. Look at javascript.internet.com or dynamicdrive.com for scripts that can validate input, provide a popup calendar for reference or specify required fields.
 


Copyright© 1996-2010
Alamo PC Organization, Inc.
San Antonio, TX USA