Simple Form Validation

Forms need to be validated so the information to be processed on the server, can be correctly processed. If the form processor (the action file) does not get the correct information, it can cause the script to break. This can do anything from cause an e-mail not to get sent, to slow down or even "break" the server.

Dreamweaver 8 provides some basic form validation using JavaScript. This means before the form is processed, the client's browser checks to see if the form was filled out "correctly". While it cannot check to see if the actual inputs are correct, it can check to see if they "look" correct.

Dreamweaver's validation cannot check on things like checkboxes, radio buttons, or lists. Only text fields. It also only checks for validation issues on the client side using JavaScript. If someone has turned JavaScript off in their browser, then it will not be validated. However, this is a fairly rare occurrence.

Let's look at some different types of basic validation Dreamweaver 8 allows for:

Validation Types

Required

Most commonly, this is done by checking to see if there is any information there. For example, imagine a login form which doesn't process correctly because the person failed to enter their password. This is often called checking for a null (or empty) value in programmer speak. In web form validation, we usually say it is a required field.

E-mail

e-mail validation ensures that the form field has a well formed e-mail address in it. JavaScript cannot determine if the e-mail is a valid e-mail or not, just that someone has entered something that could be an e-mail address.

Numeric

The field must be a number. This is often to ensure the correct type of data is entered. For example, if you ask for someone's age, and they enter "young" it may not be accepted correctly.

Numeric Range

This checks for a range of numbers. For example, if you are, like above, asking for a person's age, you can assume that the value should be between 0 and 125. As you cannot be a negative value, and the odds of someone being over 125 are so small, it is not worth considering.

Applying Form Validation in Dreamweaver 8

  1. Place your cursor inside the form. Then select the form tag in the tag selector.
  2. Open the Behavior's panel.
  3. Click on the "+" to add a new JavaScript behavior.
  4. Choose validate form near the bottom of the list.
  5. Apply the form validation preferences to each form element that needs it.

Now when someone presses the submit button, it will validate against the form elements. If there is an error, it will not let them continue.