A Few Form Rules

It should come as no surprise that there are, naturally, rules applied to HTML forms. We are discussing programming for the web, right? HTML forms are easy to create and easy to use as long as you make sure they adhere to a few basic rules and guidelines.

Rule #1: Every Form Needs a Data Connection to Be Functional

In order for a form to be functional, it must have a connection to a database through a web server. That is, a form sends its data to a page on the web server that then saves that data to a database or perhaps performs some type of manipulation of the data. Since a form gathers data from the user, it only makes sense that you store that data on the server once you've massaged it to meet the website's needs. You define the page that the form will use in the form's ACTION attribute. We'll cover that later.

Now it is possible, of course, to create an HTML form that doesn't have an ACTION attribute. Forms are often used in conjunction with JavaScript to use an event (onClick) to call a script when the submit button is clicked. In this chapter, though, we'll concentrate on forms and databases.

Rule #2: Forms Cannot Be Nested

Forms can be thought of as containers, since they contain web controls such as text boxes and check boxes. This container is a self-contained item, as well. As such, a form or any HTML element, for that matter, cannot be split across pages, nor can it be nested within another <form> tag. The <form> </form> tag pair must not contain another <form> tag, although you can put multiple <form> </form> tag pairs on a page.

If you're going to put multiple <form> tags on a page, make sure that you end the current form before starting another form. The following is an invalid form structure:

<form>  <form>  </form>  </form> 

but the following structure is perfectly legal on a single page according to HTML rules:

<form>  </form>  <form>  </form>

Rule #3: Forms Should Be Named

As you do with most tags in HTML, you should name a form. This practice let's you refer to the form in JavaScript and other code. Give the form a descriptive name that explains a bit about what the form contains. For example, the following code

<form action="" method="get" name="GetAddress"></form>

creates a form that has been named "GetAddress" because it's going to contain text fields that ask a user for address information.