Dreamweaver CS4 Form Validation Tutorial

Need a Website? Contact Us Now!

This entry is part 15 of 19 in the series Dreamweaver CS4 Tutorials

In this Dreamweaver CS4 Form Validation Tutorial we will learn how to validate a form in Dreamweaver CS4.

The form we will validate is shown below:

Dreamweaver CS4 Form Validation Tutorial

Step 1: Select the form tag

You can do this by clicking anywhere in the form and selecting the <form> tag when it shows at the bottom of the document window. The entire form will grey out to show that it is selected.

Dreamweaver CS4 Form Validation Tutorial

Step 2: Open the Behavior Inspector

Open the Behavior Inspector (Window > Behaviors)

Dreamweaver CS4 Form Validation Tutorial

Step 3: Add the Validate Form Behavior

Click the “Add Behavior” icon (+ icon) and select “Validate Form”

Dreamweaver CS4 Form Validation Tutorial

Step 4: Specify the validation requirements for each form field

In the “Validate Form” Panel that opens select each field and specify the validation required.

Dreamweaver CS4 Form Validation Tutorial

In the example below I have given the following validation requirements:

name – Required, Anything

email – Required, Email Address

phone – Required, Number

Dreamweaver CS4 Form Validation Tutorial

Step 5: Click OK and check in the browser

Click OK when you are done with the validations.

Save your page and preview in the browser. Test by trying to submit the form without the required values. You should get an error message like the one shown below:

Dreamweaver CS4 Form Validation Tutorial

Series Navigation«Forms in Dreamweaver CS4Tables in Dreamweaver CS4»
Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • Google
  • E-mail this story to a friend!
  • LinkedIn
  • MySpace
  • StumbleUpon
  • Technorati

Tags:
Posted in Dreamweaver | 3 Comments »


3 Responses to “Dreamweaver CS4 Form Validation Tutorial”

  1. By Jim on Aug 1, 2009 | Reply

    I really appreciate this tutorial!!! Thanx a lot. User from Czech Republic

  2. By Simon-Anglesey on Feb 28, 2010 | Reply

    Hi, Im new to Dreamweaver and to web construction, ive been following and enjoying the tutorials on the adobe site, with enjoyment and really feel im now getting somewhere.

    Ive followed your tutorial up to here with no problems, but where do i get the form.html file to work along with from?? it doesnt seem to be in the zip file i downloaded to work along with.

    Thanks for all your help.

    Simon

  3. By juan pablo on Apr 24, 2010 | Reply

    well.. i did all that it works very well…
    butt.. where do i put my mail..
    i mean.. i want all that goes in to my personal mail box.

Post a Comment