ASP.NET Validation Part 5 Custom Validator

This tutorial is the fifth part of the ASP.NET Validation tutorial series. This tutorial will demonstrate how to use the custom validator for client and server side validation using ASP.NET 4.0 and C#.

What is the CustomValidator?
The custom validator is an ASP.NET control that allows you to apply custom methods to a page to determine if it is valid or not. The custom validator is unique because it can be used to validate either one or many controls. Furthermore, the custom validator also allows you the option to use client side validation, server side validation, or both. The custom validator can be used to validate pretty much anything, but is mainly used in cases where other validators are simply not an option. The ASP.NET validation controls only allow specific controls to be validated by setting their ControlToValidate property. In a scenario in which you need to validate a control that cannot be set to that property, you can use the custom validator to execute a custom validation method.

We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.

Server Side Validation
First, we will demonstrate how to use the custom validator to apply server side validation to a text box. To do this, we will need to create a simple web site with a text box and button to cause validation on it. To begin, create a new ASP.NET Empty Web Site and:

1. Right click the project in your solution explorer.
2. Select add new item...
3. Select a web form.
4. Name it 'Default.aspx'.
5. Click add.
6. Open Default.aspx up to design mode.
7. Drag and drop a textbox onto the web form.
8. Drag and drop a customvalidator onto the web form.
9. Change the ErrorMessage property to 'Page is not valid.'
10. Set the ControlToValidate property to 'TextBox1'.
11. Add a break line.
12. Drag and drop a button onto the web form.

This has setup a simple form with a text box that is associated with a custom validator, and a button to cause validation when clicked. The custom validator works differently from the other validators in that you must write your own validation code on the server to determine if the page is valid or not. To do this, double click the custom validator to generate the CustomValidator1_ServerValidate event method. This method is executed when validation is caused on the page by something such as a button. Because we have a control to validate, we will be able to access the value of that control from the ServerValidateEventArgs object named 'args' that is passed to our method. However, it is important to note that even if we didn't have a control to validate, we could access the value of any control just as easily by using the control's name. An example of this would be using 'TextBox1.Text' instead of 'args.Value' to access the value we want to validate. Let's go ahead and add in some code to only validate the page if our text box reads 'Hello World'. To do this, add the following code to the CustomValidator1_ServerValidate event method:

if (args.Value == "Hello World")     args.IsValid = true; else     args.IsValid = false;

Need help with cloud hosting? Try Server Intellect. We used them for our cloud hosting services and we are very happy with the results!

This code simply checks the value we want to validate, and then sets the 'args.IsValid' property to the proper value. This allows us to have full control over our validation because we can write any code to determine whether or not to change that property. To have this validator check mutliple controls, we would simply need to add in some conditions based on the control's value and then set this property appropriately.

Testing Server Side Validation
Let's go ahead and test this out to ensure that our server side validation is working. To do this, load up the web site and test the following data in the text box by clicking the button:

TextBox1	Result
Empty	No error, this is because the field was empty and not checked.
Hello Validation	Error, the text was invalid.
Hello World	No error, the text was valid.

To prevent the page from being valid when the text box is empty, you can simply apply a required field validator to it. Other than that, the validation works as intended.

Client Side Validation
To add client side validation, we will need to add in a javascript function and direct our custom validator to that function. To do this, open up Default.aspx to source mode and add in the following javascript function:

function clientValidation(source, arguments) {     if (arguments.Value == "Hello World")         arguments.IsValid = true;     else         arguments.IsValid = false;     alert(arguments.IsValid); }

This function does pretty much the same thing as our server validation method by checking for 'Hello Word'. Then, it will simply display a popup message that will display whether or not the page is valid.

If you're looking for a really good web host, try Server Intellect - we found the setup procedure and their control panel, very easy to adapt to and their IT team is awesome!

Next, we need to configure our custom validator so it actually calls this function when validation is triggered. To do this, change the ClientValidationFunction property of the custom validator to 'clientValidation'.

Testing Client Side Validation
To test the client side validation, load up the web site and use the same data we used earlier to test the server side validation. Notice that before you get an error message on the page, the popup is displayed telling us whether or not the page is valid. This is because the javascript function we added executes before anything happens on the server.