Dreamweaver MX 2004 Extensions

Jaro von Flocken’s Check Form behavior for form field validation is definitely an extension that should be part of your developer toolbox. The latest version of Check Form (version 4.66.0) has been selected by Macromedia as one of the top three extensions currently available for Dreamweaver:

http://www.macromedia.com/software/dreamweaver/special/extensions

You can download Check Form for free from the previous link, and Jaro’s web site at http://www.yaromat.com (it is easy to navigate to).

As we learned in previous chapters, client-side form validation using JavaScript is very useful to check for data consistency before submitting it to the server.

TIP As stated in Chapter 5, be aware that users can disable JavaScript in their browsers. Therefore, it is always good practice to combine client-side and server-side validation.

Dreamweaver ships with a behavior called Validate Form, which offers basic form field validation. And, as we described earlier in the book, ColdFusion has some useful built-in form validation facilities in its <cfform> (and associated) tags.

Nevertheless, neither of these client-side validation options offers the same flexibility and amount of features as Check Form provides. The Validate Form behavior, for example, doesn’t present any kind of control for date and time format validation, doesn’t validate anything but text fields, and doesn’t allow the customization of the error message. Forms created with <cfform> also have some problems: even if correctly rendered in Design View, they won’t be recognized by Dreamweaver as valid form instances, with the result that you won’t be able to apply behaviors or server behaviors to them.

After you install it, the Check Form extension is available from the Behaviors panel (+ -> Yaromat -> Check Form), ready to be applied to the form you want to validate. The Check Form extension has many options for validating form elements, which vary according to the field type. The following is a list of controls Check Form lets you implement:

• Required: Checking this option denotes the field as required.

• Anything: The field can accept any value.

• Anumber from . . . to . . . : The field can accept any number within the specified range.

• E-Mail Address: This control checks if the value entered into the field constitutes a valid e-mail address.

• Date: Use this to choose from many date format validation options (including MySQL date format) to ensure valid database entries. It not only checks that the value is in a proper date format, but also if the date in fact exists (for example, the 30th of February 2003 is not a valid date).

• VTime: Use this to choose from many different time format validation options.

• This must be checked too: You select this to create dependency between radio buttons or checkboxes and other form fields. For example, you can make it so that a check box has to be checked before content in a text field is accepted.

• This must be the same: Extremely useful for password validation—this option allows you to specify that the contents of two different fields must be the same.

• Menu: This control lets you force the user to make a selection from a pop-up menu.

• Textarea: Here you can specify the minimum number of characters that the user must enter in a text area field.

• Checkbox: This control tests to see if a check box is checked, and lets you define a dependency between a checkbox and other form fields.

• Radiobutton: This control offers the same function as Checkbox, but for radio buttons.

• Error message: Us this to define a custom error message for every field that does not succeed the validation control.

To appreciate some of these features, let’s build a simple survey form.