Performing Form Validation with Validation Controls
- Using Client-side Validation
- Requiring Fields: The RequiredFieldValidator Control
- Validating Expressions: The RegularExpressionValidator Control
- Comparing Values: The CompareValidator Control
- Checking for a Range of Values: The RangeValidator Control
- Summarizing Errors: The ValidationSummary Control
- Performing Custom Validation: The CustomValidator Control
- Disabling Validation
- Summary
This chapter is from the book
This chapter is from the book
This chapter is from the book
You can use the Validation controls to perform very different types of form validation tasks. For example, you can use the Validation controls to check whether a form field has a value, check whether the data in a form field falls in a certain range, or check whether a form field contains a valid e-mail address or phone number.
NOTE
You can view "live" versions of many of the code samples in this chapter by visiting the Superexpert Web site at:
http://www.Superexpert.com/AspNetUnleashed/
INFORMIT EDITOR'S NOTE
Code samples from this book are no longer available. However, samples from ASP.NET 2.0 Unleashed can be found at http://www.superexpert.com/Books/AspNet2Unleashed/Default.aspx.
At the end of this chapter, you also learn how to create custom validation functions by using the CustomValidator control. Even if you need to perform a very specialized form validation task, you can do so by using this control.
Using Client-side Validation
Traditionally, Web developers have faced a tough choice when adding form validation logic to their pages. You can add form validation routines to your server-side code, or you can add the validation routines to your client-side code.
The advantage of writing validation logic in client-side code is that you can provide instant feedback to your users. For example, if a user neglects to enter a value in a required form field, you can instantly display an error message without requiring a roundtrip back to the server.
People really like client-side validation. It looks great and creates a better overall user experience. The problem, however, is that it does not work with all browsers. Not all browsers support JavaScript, and different versions of browsers support different versions of JavaScript, so client-side validation is never guaranteed to work.
For this reason, in the past, many developers decided to add all their form validation logic exclusively to server-side code. Because server-side code functions correctly with any browser, this course of action was safer.
Fortunately, the Validation controls discussed in this chapter do not force you to make this difficult choice. The Validation controls automatically generate both client-side and server-side code. If a browser is capable of supporting JavaScript, client-side validation scripts are automatically sent to the browser. If a browser is incapable of supporting JavaScript, the validation routines are automatically implemented in server-side code.
You should be warned, however, that client-side validation works only with Microsoft Internet Explorer version 4.0 and higher. In particular, the client-side scripts discussed in this chapter do not work with any version of Netscape Navigator.
Configuring Client-side Validation
The Validation controls make use of a JavaScript script library that is automatically installed on your server when you install the .NET framework. This library is located in a file named WebUIValidation.js.
By default, WebUIValidation.js is installed in a directory named aspnet_client located beneath your Web server's wwwroot directory. If you change the location of your root directory, you need to copy the aspnet_client directory to the new directory; otherwise, the validation script will not work. If WebUIValidation.js can't be found, you receive the error Warning! Unable to find script library 'WebUIValidation.js' (see Figure 3.1).
){kind=link}
Figure 3.1. Error from missing validation file.
NOTE
The exact location of the WebUIValidation.js file is determined by your machine.config file (in the <webControls clientScriptsLocation> section). To learn more about the machine.config file, see Chapter 15, "Creating ASP.NET Applications."
Microsoft includes a command line tool with the ASP.NET Framework named aspnet_regiis that you can use to automatically install and uninstall the script library. To install the script library execute aspnet_regiis -c, to uninstall the library execute aspnet_regiis -e. The aspnet_regiis tool is located in your \WINNT\Microsoft.NET\Framework\[version]\ directory.
Enabling and Disabling Client-side Validation
If you request a page that contains a validation control, and you are using Microsoft Internet Explorer version 4.0 or higher, JavaScript code is automatically sent to your browser.
If, for whatever reason, you want to disable client-side form validation, you can do so by adding the following directive at the top of your page:
<%@ Page ClientTarget="downlevel" %>
This directive disables client-side form validation. Unfortunately, however, it also prevents all the ASP.NET controls on the page from rendering any non-HTML 3.2 compatible content. For example, the directive also prevents the rendering of Cascading Style Sheet attributes to the page.
NOTE
The ClientTarget attribute accepts a string value that corresponds to one of the entries in the <clientTarget> section of the machine.config file. In the machine.config file, uplevel is defined as Internet Explorer 4.0 and downlevel is defined as the Unknown browser. The Unknown browser is assumed to not support Cascading Style Sheets.
Alternatively, you can disable client-side validation for individual validation controls by setting the EnableClientScript property to the value False. Since all validation controls share the EnableClientScript property, you can use this property to disable client-side scripts for particular validation controls or for all validation controls.
Finally, you can disable validation, both client and server validation, when certain buttons are pushed. You'll need to do this when creating a Cancel button. See the last section of this chapter, Disabling Validation, for sample code that demonstrates how to do this.