Creating A Simple Form

Before you can even begin to create a form you have to understand a few concepts. Up until this point in the lessons, your web pages have been relatively self contained. When you get into forms you are doing something a little different - you are communicating not only with a person (entering data) but often with a web server (to store or format the data).

This is usually the first thing that a beginning webmaster runs into that forces them to stop thinking of a web page as a totally self contained unit. That's one of the primary reasons that many people have so much trouble with them.

As you can see from the simple drawing above, (1) a person enters data into a form on your web page (2) which accepts all of the fields (a field is a single piece of information such as a name). When the person submits the form by clicking the submit button, all of this information is passed at once to the web server (3) which performs the appropriate action.

The important fact to remember is step 3. This is the primary area that I have found people tend to have the most problems.

Step 3 is performed (usually, and there are a few exceptions) by an external routine. This can be just about anything, as long as it is able to accept the information and process it as needed.

Remember, no matter which product you are using, even if it is Frontpage, the same steps are performed (again, with a few exceptions). Frontpage does include some other steps, which are a little more complicated and we won't go into them here.

What happens at step 3? The data is received by a program or routine which executes on the web server. This is a very important fact to remember - the form causes something to run on a web server. It does not have to be your own web server - in fact, quite often it is not. But something has to be executed somewhere to do something with the data from the form.

All right, all that being said, how do you make a simple form? First, you must have access to the routine at the web server to process your data. If you are using Frontpage, you must make sure that your web host supports Frontpage extensions. Many people use a service such as offered by Bravenet, which accept form data and send it via email.

Now design your form. Take a piece of paper and write down what you want the form to look like. Just draw the boxes and the fields roughly in the same positions as you want them to appear on the screen.

Okay, the next step is to insert the

tag. An example looks as follows:

What this says is simply "when the user clicks the submit button (whatever it is named) send the form data to "ennyfrms.cgi". It is up to that routine to perform the necessary action on the data. In this case, the data is sent via email to the webmaster.

Now enter the form fields one at a time. We will not be getting into the more complicated fields and options here, just a simple text field is all we want to do.

What this says is "get a text field, make the box 35 characters long, and no long allow more than 256 characters to be entered". The name is set to "Name".

Remember you can also include all of the formatting that you want, including descriptions of what to enter, tables, images and practically anything else that you desire.

All right, you are almost there. When you've got all of the fields, simply add the code for the submit button, and optionally the reset button (clears all of the fields).

Now for the final piece. Just close the form.

An example of a very simple form is shown below.

Please Send Me Your Name

Name

That's about all there is to a very simple form.