Form Basics

You all know what forms are - if you glance to your right you'll see 3 of them on this very page!

Put simply, forms are what allow your site visitors to send information back to you or your site's server. The most common type of form is the mailform, used to e-mail the information entered to the site owner. There's a mailform on the HTML Central Feedback page.

So how do these wonders of modern coding work then? Well, if you're sitting comfortably I'll begin.

The FORM Tag

Big surprise, forms involve a FORM tag! No prizes for guessing that one I'm afraid.

A form is in fact made up of two important elements - the FORM tag, which tells the browser how to process the data, and a set of input fields or controls (like text boxes, radio buttons, etc.) that actually take the user's input.

Let's start with the form tag - it will surround all of the controls to be bound to your form. To tell the browser what to do with your form inputs, it uses two attributes: METHOD and ACTION. The form's method is normally either GET or POST (depending on how it's meant to work). The ACTION will point to some other code that processes the data - maybe JavaScript, but more often it will be some kind of server side language script, often CGI.

CGI? Huh?

What's a CGI script? It's just some rather clever code written in a complicated language (Perl to be precise) that you don't need to worry about. It will take all your form data, play around with it and (in the case of a mailform) stick it in an e-mail and send it you.

All you need to know is the path to the CGI script - think of it as a normal file. You can use one on your own server, provided by your ISP, or one on an external server. A small number of ISP's will allow you to upload your own scripts to the server, but most restrict you to what they have provided.

Once you've found the path to the script, throw it into the ACTION attribute and set the METHOD attribute to either GET or POST depending on what the form you're using requires (check with your ISP / the author of the script).

Now that you've got your FORM tag sorted out, you've just got to add some fields / controls, to allow your visitors to actually send you some information. We'll look at the various controls on offer on the next few pages.

A Simple Mailform

Before we move on I should mention that you can actually create a mailform without using a CGI script. Simply use the following as your form tag:

<FORM METHOD="POST" ACTION="mailto:htmlcentral@j-robinson.co.uk">

Replace the e-mail address with the address you want to send the information to. Add some controls and a </FORM> tag and you're done.

The problem with this type of mailform is that it's messy. It relies on the browser being set up with an e-mail program to process that data. If no program is set up, it won't work. And even if a program is set up, it may throw up some unusual messages.

Therefore for the smoothest of mailforms, use a script. Only use MAILTO as a last resort.