Friday, May 29, 2009

Page.IsValid and Validate And JavaScript

In this post I will try to explain you how you can use the Page.IsValid and Validate function in web application.Here I have a situation where I have to used the IsValid property and the Validate function in one of the web page. The problem is When you have some validation on client side and depending on the validation you return either true or false from the client validation function, If the client validation return true then validator are not fired. The validator like require field validator, range validator, regular expression validator and custom validator etc. So in order to the client and validator work in parallel we have to use the validate and the IsValid property of the Page.
Let us start with our example code. For this example code I have two text box one is for the user name and the second one is for the user password, I have only one required field validator for the user name, So that you can understand what the problem is. Next I have three button control for three different scenarios,

1- Sign In (IsValid):
The First button which is the sign in (IsValid) consist of the some JavaScript validation and in the click event handler it will check the Page.IsValid property as well.
2- Sign In: It only has the server side validator and will be fire when you press this sign in button.
3- Sign In (JavaScript): This Sign in (JavaScript) button consist of the javascript validation and it will not check the Page.IsValid property.

Let me discuss this example in three steps

Step 1 (Server Side Validators):
In the first step which is very simple one and will fire only the server side validator and you can see this by pressing the simple Sign in button. If you don't have any of the client side validation then only the server side validator are fires and you will see the validators message on the form. Here is the output when you will click the Sign In button.

Step 2 (Server Side Validator And Client Side Validation):
In the next step which is performed on the Sign In (JavaScript) button, this button has some client side, which is added as the attribute of the button and the attribute is the click event of the button. For this problem I have one javascript function. which only return true, so that you can understand what the problem is. In this case as the client side validation return true so the server side validation is not catch and the server side event handler for the button is executed, and in this case as I have put the Server.Transfer to redirect to the next page. The server side validation is not catch and user will not see the validator message although user didn't enter the login name in this case.

Step 3 (Page.Validate And Page.IsValid):
Now from the step 2 we have notice that although we have server side validator but when the client side validation return true value then the server side validator are not catched and the page is redirected to the next page. To solve the problem in the step 2 , mean to check the validity of the validator we will use the Page.IsValid and Page.Validate. Here is the code which is used to validate the server side validators.
if (Page.IsValid)
In the code above I have called the Page.Validate() function.This method is invoked when a user clicks any ASP.NET server control that has the CausesValidation property set to true, which is the default. These include the Button, ImageButton, and LinkButton Web server controls, the HtmlInputButton, HtmlInputImage, and HtmlButton HTML server controls, and controls that can automatically post back to the server such as the TextBox, CheckBox, ListControl, and BulletedList controls. To disable validation for any button control on the page, set the button control's CausesValidation property to false.
When this method is invoked, it iterates through the validation controls contained in the ValidatorCollection object associated with the Page.Validators property and invokes the validation logic for each validation control in the current validation group. The validation group is determined by the control that posted the page to the server. If no validation group is specified, then no validation group is used.
Then to before redirection I have check the Page.IsValid property which return either true or false depending on the result of the validators on the page. For this property to return true, all validation server controls in the current validation group must validate successfully. You should check this property only after you have called the Page.Validate method, or set the CausesValidation property to true in the OnServerClick event handler for an ASP.NET server control that initiates form processing.If you force validation of a validation group using the Validate method, then all validation controls in the specified validation group must validate successfully as well.
So by using the Page.Validate and Page.IsValid property we solved our problem of catching the validity of the server side validators.You can download the source code from here.

All and any comments / bugs / suggestions are welcomed!

No comments: