Home
Username:
Password:
Adobe Dreamweaver CS3 Tutorials

Creating Forms / Validating Form Data




Visitors to VTC.com will be able to view all introductory videos for each training course.
Free Trial Members will gain access to first three chapters for each training course.
Full Access Members have full access to VTC.com’s entire library of video tutorials.


Learn More

Subtitles of the Movie

You can validate your forms using Dreamweaver's form behavior. This behavior checks the contents of specified text fields to ensure that the user has entered the correct type of data. Dreamweaver alone however cannot process the form data itself. To do this, you'll need to write or modify a CGI script. Check one of our advanced Dreamweaver courses for details on how to process your Dreamweaver forms, or Google forms processing scripts for a sampling of scripts to handle the form data once your users have submitted the form. Before inserting your validate form behavior, make sure your form is ready to accept the behavior. Do this first by clicking on each of your text fields. Make sure that there is a name here in the text field area of the property inspector. It should be a descriptive name so you know which one is which. When you actually get into the validate form behavior dialog these labels here that I've put in my table will not be there. You'll only have these labels here in your text field text box here to identify each of the text boxes in your form. So notice that my zip code is labeled zip code, my email email, actually I didn't name that one so let's go back and name that one email. Also, change the name of your submit button to validate. Validating and submitting your form are usually two different things with Dreamweaver. You may need to go back and add another form button for the submit process like so. Now you're finally ready to insert the validate form behavior. Click on the validate button and then from the main menu choose window behaviors midway down the menu. That will bring up the behaviors panel. Click on the add behavior button or the plus button and choose validate form from the list. That will bring up the validate form dialog. Let's spend some time going through in detail the various settings here in the validate form dialog. Notice that there's all of my text fields appropriately labeled. First let's require that they add their first name and last name. Let's also require that they add a zip code. We're not going to require an email. Next in the input first name let's accept anything that they type, same as last name. However for the zip code let's require that they type a number. And for the email let's require that they enter a valid email address. I can even specify which numbers they can enter here. I can enter a range, so for example, I can enter one to two, so that only one or two is accepted for the numbers of any of the text fields. Let's go back and delete those two, double-check everything that I've added so far. So I'm requiring an email address in the email input text box; I'm requiring a number in the zip code; I'm also requiring that they enter a zip code, and a last name and a first name. That looks good, let's click OK, close my behaviors panel. Now one of my golden rules in working with Dreamweaver CS3 is to always check a behavior as soon as you apply it to your page, so let's do that. Let's save this document and now let's preview it in my browser, and let's now click on the validate button and we should get a bunch of errors. First name is required, last name is required, and zip code is required. So let's type in, and I allowed anything in the first and last name, however I required there to be only numbers in the zip code and I also required a valid email address. So let's not have any of that. And now let's validate again. This time I found two errors. The zip code must contain a number, and an email must contain an email address. So let's go back and notice that I restricted the number of letters to the zip code to five. And now let's type in a valid email address, gonzalez500@hotmail.com, let's validate it, and sure enough it didn't find any errors. And that will wrap up this section of the tutorial on creating forms in Dreamweaver CS3. In this section you've learned about client side forms and how to create HTML forms. You've learned about inserting form objects. I provided a survey of some of the more common form objects in Dreamweaver. And the section concluded with a review of the Dreamweaver's validate form behavior, which checks the contents of specified text fields to ensure that the user has entered the correct type of data. Let me now move on to the next section of the tutorial, library items where I include movies about creating libraries, inserting and updating libraries, and also some library management tips.

Tutorial Information

Course: Adobe Dreamweaver CS3
Author: James Gonzalez
SKU: 33789
ISBN: 1-934743-04-6
Release Date: 2007-09-06
Duration: 10 hrs / 125 lessons
Work Files: Yes
Captions: For Online University members only
Compatibility: Vista/XP/2000, OS X, Linux
QuickTime 7, Flash 8

VTC Sign up & Benefits

  • Unlimited Access
  • 98,729 Video Tutorials (23,265 free)
  • Video Available as Flash or QuickTime
  • Over 1026 Courses
  • $30 for One Month Access
  • Multi-User Discounts Available