| When you start using forms to interact with a database, it becomes very important to validate the information your forms are sending. This is especially true when using web forms to insert new records into a database or to edit existing database information. Form validation is the process of making sure that the information contained in the form is of the proper type. For example, if there are required fields on the form, have they been filled in? If a particular field is supposed to contain numbers only, does it actually contain the correct data type? Without form validation, it is possible for users to send incorrectly formatted information to your database. This could cause your queries to break or, worse yet, to corrupt the information in your database. There are two broad types of form validation: server-side validation and client-side validation. The major difference between the two is where the validation takes place. With server-side validation, the form is submitted by the user and sent to the web server. The server then checks the contents passed by the form and checks it for required fields, proper data types, and so on. If the form variables contain any incorrect information, the form is not processed, and an error message is returned to the user. With client-side validation, when the user clicks the Submit button, it triggers a validation routine (usually written in some sort of scripting language such as JavaScript or VBScript) included in the form page source code. This validation routine checks that the form contains the correct information and, if it does not, provides feedback to the user to correct the information. With client-side validation, the form is not actually submitted to the server until it passes the validation routine. Each method of form validation has pros and cons. The advantages and disadvantages of each approach will be explored in the section "When to Use What" later in this step. First, however, let's look at how to implement form validation using each approach. Server-Side Validation ColdFusion enables you to perform server-side validation on any form submitted by your users. You accomplish this by adding hidden fields to the form that contain instructions for your ColdFusion server. These hidden fields are included in the code of the form page but are not visible to the form user. Figure 5.12 shows a form with two fields, one for the user to enter his name and another for him to enter his credit card number. We want to add form validation to make sure both fields are filled in, and we also want to make sure the credit card number field contains only numbers. Figure 5.12. A credit card form. To implement server-side validation, we simply add hidden fields to our forms. These hidden fields, however, must follow certain rules. A hidden field must have the same NAME value as the field you want to validate, plus an additional suffix indicating which type of validation rule you want to apply. For example, the following code shows how we would go about making the Name field in our form, a required field. <INPUT TYPE="text" NAME="Name"> <INPUT TYPE="hidden" NAME="Name_required"> We can add seven different suffixes to perform server-side validation on our form fields. Table 5.1 lists the valid suffixes and their descriptions. Table 5.1. Form-Field Validation Suffixes| Suffix | Description |
|---|
| _date | The submitted field must have a date value. Most common date formats are supported, such as MM/DD/YY and MM/DD/YYYY. | | _eurodate | Similar to _date but the field must be in European date format with the day value listed first, DD/MM/YY. | | _float | Used for numbers with decimal point values. | | _integer | Used for numbers without decimal point values. | | _range | Used to specify numbers within a certain range. For example: <INPUT NAME=Age_range Value="MIN=18 MAX=100"> | | _required | The submitted field must not be left blank. | | _time | The submitted field must have a time value. |
If you want to use more than one validation rule on a form field, you simply add an additional hidden field with the validation suffix for that rule. You also can add a custom message to be displayed in the event of validation failure by adding the VALUE attribute to your hidden field. For example, the following code shows how you can specify the credit card number field (CCNumber) as both a required field and one that must contain an integer. <INPUT TYPE="text" NAME="CCNumber"> <INPUT TYPE="hidden" NAME="CCNumber_required"> <INPUT TYPE="hidden" NAME="CCNumber_integer" VALUE="Credit card number should contain numbers only"> If we were to submit the form shown in Figure 5.12, the ColdFusion server would respond with the error message in Figure 5.13. Although it might not be the prettiest error message in the world, it is functional and does tell your user what has gone wrong. Figure 5.13. A validation error message. Client-Side Validation Whereas server-side validation is done by the server after the form is submitted, client-side validation is done by the user's browser before the information even gets sent to the server. Client-side validation is usually done with some sort of script (JavaScript or VBScript) that is embedded in the form page. When a user clicks the submit button, the contents of the form variables are run through the script. If the form information passes all the validation rules in the script, the information is then sent to the server. If the form information does not pass the validation rules in the script, an error message is displayed, and the user must correct the form information before it can be submitted. There is nothing wrong with this method of form validation except that it entails learning a scripting language such as JavaScript. ColdFusion enables you to perform client-side form validation through the use of several special ColdFusion form tags, and ColdFusion will even write the JavaScript validation routines for you! |