Validation Server Controls

Size: px

Start display at page:

Download "Validation Server Controls"

Hugh Jefferson
5 years ago
Views:

Validation Server Controls Definition: Validation is a set of rules that you apply to the data you collect. A Validation server control is used to validate the data of an input control.

1 Validation Server Controls Definition: Validation is a set of rules that you apply to the data you collect. A Validation server control is used to validate the data of an input control. If the data does not pass validation, it will display an error message to the user. Validation Controls, which are non-visible controls, but allow the easy use of both server-side and client-side form validation. Validation server controls are set of controls that enable you to work with the information your end users inputs into application. Application should always ensure that valid data is recorded. To ensure valid data is collected, we apply set of validations to data we collect. Validation is a set of rules that you apply to the data you collect. We can understand validation under two categories: Client side validation and Server side validation. Client side validation involves validating user input before the page is posted to server. Server side validation involves performing checks on server instead of client. This is most secure form but comes at cost of performance. ASP.NET introduced smart validation server controls to implement page level validations. They are capable of performing both server side and client side validations. So, Validation server controls offer the combined power of both approaches such that the security of application is never compromised. Validation Properties Usually, Validation is invoked in response to user actions like clicking submit button or entering data. Suppose, you wish to perform validation on page when user clicks submit button. To make this happen, simply set the CauseValidation property to True for submit button as shown below The syntax for creating a Validation server control is: <asp:button ID="Button1" runat="server" Text="Submit" CausesValidation=true />

2 Basic Validation Properties Property BackColor ControlToCompare ControlToValidate Display EnableClientScript Enabled ErrorMessage ForeColor id IsValid Operator runat Text Type ValueToCompare Description The background color of the CompareValidator control The name of the control to compare with The id of the control to validate The display behavior for the validation control. Legal values are: None (the control is not displayed. Used to show the error message only in the ValidationSummary control) Static (the control displays an error message if validation fails. Space is reserved on the page for the message even if the input passes validation. Dynamic (the control displays an error message if validation fails. Space is not reserved on the page for the message if the input passes validation A Boolean value that specifies whether client-side validation is enabled or not A Boolean value that specifies whether the validation control is enabled or not The text to display in the ValidationSummary control when validation fails. Note: This text will also be displayed in the validation control if the Text property is not set The foreground color of the control A unique id for the control A Boolean value that indicates whether the control specified by ControlToValidate is determined to be valid The type of comparison to perform. The operators are: Equal GreaterThan GreaterThanEqual LessThan LessThanEqual NotEqual DataTypeCheck Specifies that the control is a server control. Must be set to "server" The message to display when validation fails Specifies the data type of the values to compare. The types are: Currency Date Double Integer String A specified value to compare with There are a number of common properties in these controls. The major ones are: ErrorMessage In case of an error, the system displays this message at the location of the control, and in the summary report, if any. Display A validation control is kept invisible until a bad input is entered. In case of a bad input, the system has to display the error message.

3 The display mechanism can be handled in one of three ways. Display= static Initially, enough room in the page is reserved for the expected error message. Display= dynamic No room is initially reserved. In case of an error, the message is displayed by displacing existing contents of the page. Display= none The message won t be displayed at the location of the control; however, it will be reported in the summary report, if any. The RequiredFieldValidator Control In the following example, the user is expected to enter two values. If he or she skips any one of the values and clicks the Submit button, the system will report the error. Please notice that we do not require any extra code for performing this validation.when the Submit button is clicked, the form will be sent to the server, and the server will do the automatic validation.the run-time view of this application is shown in Figure 3.50.The code for this application, as shown in Figure 3.51, is self-explanatory and is also available in the accompanying CD in a file named Validator1.aspx. Figure 3.50 Using the RequiredFieldValidator Control Figure 3.51 Validator1.aspx <! - Chapter3\Validator1.aspx > <! Required Field Validator > <html><head</head> <title>example on Required Field validator</title><body> <form runat="server"><br> Enter Your Name: <asp:textbox id="txtname" rows="1 " width="50" runat="server"/> <asp:requiredfieldvalidator id="validtxtname" runat="server" controltovalidate="txtname" errormessage="name must be entered" display="static"> </asp:requiredfieldvalidator></br> Hours worked? <asp:textbox id="txth" width ="30" runat="server" /> <asp:requiredfieldvalidator id="validtxth" runat="server" controltovalidate="txth" errormessage="hours must be entered" display="static"> </asp:requiredfieldvalidator></br> <asp:button id="btnsubmit" runat="server" text="submit" /> </form></body></html>

4 The RegularExpressionValidator Control The RegularExpressionValidator control is typically used to match an input pattern. As an example, let us assume that the value of hours-worked field must have one to three digits. In this case, we will add a RegularExpressionValidator to the txth control. In the RegularExpression property of the RegularExpressionValidator, we will specify a pattern /d{1,3}. This will force the system to raise an error if the user input is not one-to-three digits long.the output of this application is shown in Figure 3.52.The code for this example is shown in Figure 3.53 and is also available on the accompanying CD in a file named Validator2.aspx. Figure 3.52 Using RegularExpressionValidator Controls Figure 3.53 Validator2.aspx www. <! - Chapter3\Validator2.aspx > <%@ Page Language="VB" Debug="true" %> <html><head</head><body> <form runat="server"><br> Enter Your Name: <asp:textbox id="txtname" rows="1" width="60" runat="server"/> <asp:requiredfieldvalidator id="validtxtname" runat="server" controltovalidate="txtname" errormessage="name must be entered" display="static"> </asp:requiredfieldvalidator></br> Hours worked? <asp:textbox id="txth" width ="40" runat="server" /> <asp:requiredfieldvalidator id="validtxth" runat="server" controltovalidate="txth" errormessage="hours must be entered" display="static"> </asp:requiredfieldvalidator> <asp:regularexpressionvalidator id="regvh" runat="server" display="static" controltovalidate="txth" errormessage="hours must be 1-3 digits only" validationexpression="\d{1,3}"> </asp:regularexpressionvalidator></br> <asp:button id="btnsubmit" runat="server" text="submit" /> </form></body></html> ---- Validation---- <asp:textbox ID="TextBox4" runat="server"></asp:textbox> <asp:regularexpressionvalidator ID="RegularExpressionValidator1" ControlToValidate="Textbox4" runat="server" ErrorMessage="You must enter an address" ValidationExpression="\w+([-

$+.']\w+)*@\w+([-.$ $]\w+)*"> </asp:regularexpressionvalidator> <asp:button ID="Button3" runat="server" Text="CheckMail"/> As indicated above, we are using RegularExpressionValidator to define the structure of input to$

5 </asp:regularexpressionvalidator> <asp:button ID="Button3" runat="server" Text="CheckMail"/> As indicated above, we are using RegularExpressionValidator to define the structure of input to be entered in above textbox. You can specify the pattern for RegularExpressionValidator using ValidationExpression property. ASP.NET 2.0 provides predefined set of universal patterns (Regular Expressions) to choose from through Regular Expression Editor. To see Regular Expression Editor in action, switch to Design mode. Open RegularExpressionValidator control in Design View. From Properties dialog box, click button next to ValidationExpression Property. You can see below given Regular Expression Editor window Regular Expression Editor The CompareValidator Control The CompareValidator control compares an input to a specified value or to the value of another control.you can also use it to check if the input is of any particular data type. In our next example, we will add a textbox named txtr. In this textbox, the user will enter the hourly rate. Suppose that we want the data-type of this field to be Double.We will

apply a CompareValidator control to test the data-type of the txtr. Note that if the data entered is convertible to the desired data-type, the validation will succeed.

6 apply a CompareValidator control to test the data-type of the txtr. Note that if the data entered is convertible to the desired data-type, the validation will succeed.the run-time view of the application is shown in Figure Figure 3.54 Using the CompareValidator Control We have added the code following code to accomplish this objective (you may review the complete code in the file named Validator3.aspx on the CD). Please notice that we have set the type property to Double, and the operator property to DataTypeCheck. <asp:comparevalidator id="comvr" runat="server" display="static" controltovalidate="txtr" errormessage="rate must be numeric" type="double" operator="datatypecheck"> </asp:comparevalidator></br> In the type property of the CompareValidator, we may specify: String, Integer, Double, DateTime, and Currency. In the operator property, we may specify: Equal, NotEqual, GreaterThan, LessThan, GreaterThanEqual, LessThanEqual, and DataTypeCheck. The RangeValidator Control You can use this control to check if an input is within an acceptable range. Suppose that we want to provide a textbox for collecting data on number of dependents. We want to enforce a constraint that this field should be from 0 to 10. Figure 3.55 illustrates the use of a RangeValidator in this particular situation. Figure 3.55 Using the RangeValidator Control In our code, we have used the type, minimumvalue, and maximumvalue properties of a RangeValidator to apply the constraint.we have applied the RangeValidator as follows: (The complete code is available in Validator4.aspx.) <asp:rangevalidator id="ranvdependents" runat="server" display="static" controltovalidate="txtdependents" errormessage="must be from 0 to 10" type="integer" minimumvalue=0 maximumvalue=10> </asp:rangevalidator></br>

7 The CustomValidator Control In many situations, we may not be able to use the existing validators to validate a omplex rule. In that case, we may apply a CustomValidator. When applying a CustomValidator, we may provide our own functions that will return true or false. We may develop the code for server-side validation only, or we may develop the code for server-side as well as the client-side validation. Suppose that the user will enter the data about his or her department number. Also suppose that the department number must be evenly divisible by 10.We will develop a simple custom validator to enforce this rule at the serverside.the run-time display of this application is shown in Figure Figure 3.56 Using the CustomValidator Control We have developed a VB function named validatedeptnum to erform the check.we have also specified its name in the onservervalidate property of the CustomValidator control. An excerpt from the complete code for this application is shown in Figure 3.57.The complete code is available on the CD in the file named Validator5.aspx. Figure 3.57 The Code for CustomValidator (Validator5.aspx) What is your Department Number? <asp:textbox id="txtdeptnum" width ="40" runat="server" /> <asp:customvalidator id="cusvdeptnum" runat="server" display="static" controltovalidate="txtdeptnum" onservervalidate="validatedeptnum" errormessage="must be in multiples of 10" > </asp:customvalidator></br> <asp:button id="btnsubmit" runat="server" text="submit" /> </form></body></html> <script language="vb" runat="server"> Sub validatedeptnum(source As Object, s as ServerValidateEventArgs) If (CInt(s.Value) Mod 10)=0 Then s.isvalid= True Else s.isvalid=false End If End Sub </script> Although this example illustrates the server-side validation,asp.net automatically writes client-side code to perform the validation.there are various options available to prevent this from occurring and also not to display the code that shows the client-side JavaScript validation.we will not be going into these in detail. In the server-side custom validation, the validation function is included in the server-side script tag <script language= VB runat= server >. We need to specify the name of the validation function in the OnServerValidate property of the CustomValidator control.the validator

8 control calls this function with two parameters: the first parameter is the control itself, whereas the second parameter is an instance of the ServerValidateEventArgs class.this object encapsulates the methods and properties that enable us to access the value of the control being validated and to return whether the control has been validated or not. Note: If the client-side validation is active (which is the default), the browser does not submit the form back to the server until all corrections have been made on the client-side. If you have a server-side-only custom validator along with some other fields that employ client-side validation, then on click of the submit button, the form may not appear to work properly. That is expected because the browser will not submit the form until all client-side validated fields are correct. CustomValidator with Explicit Client-Side Validation Function In the CustomValidator, we may specify a twin client-side validation function. To employ the client-side validation, we will have to specify the name of the client-side validation function in the ClientValidationFunction property of the CustomValidator control.the client-side function needs to be coded in JavaScript, and it should also return true or false.obviously, the client-side validation should perform the same checks that are done by the server-side validation function. We will revise our previous example to include a client-side validation function. We have already developed the server-side validation function for the department number textbox. Now we will implement the client-side validation. The run-time display of the application is shown in Figure Figure 3.58 Using CustomValidator with Explicit Client-Side Validation The part of the code that is pertinent to our example is shown in Figure In this code, you will notice that we have specified the name of the JavaScript validation function in the ClientValidationFunction property of the control to be validated. Figure 3.59 Partial Listing of Validator6.aspx <asp:customvalidator id="cusvdeptnum" runat="server" display="dynamic" controltovalidate="txtdeptnum" onservervalidate="validatedeptnum" ClientValidationFunction="checkModTen" errormessage="dept. Number must be a multiple of 10" > </asp:customvalidator></br> <script language="javascript" > function checkmodten(source, s) { var y=parseint(s.value); if ((y % 10) == 0 &&!(isnan(y))) s.isvalid=true; else

s.isvalid=false; } </script> Displaying the Error Message with Style In this example, we will set various properties of the validation controls to display its message with style.

9 s.isvalid=false; } </script> Displaying the Error Message with Style In this example, we will set various properties of the validation controls to display its message with style.the output of the application is shown in Figure 3.60.We have set a number of properties, such as forecolor, bordercolor, tooltip, and so on, to our number of dependent validators. The part of the code that is relevant to format the validator is shown in Figure 3.61 Figure 3.60 Displaying Error Message with Style <asp:rangevalidator id="ranvdependents" runat="server" backcolor="salmon" forecolor="blue" bordercolor="green" borderstyle=solid borderwidth=5 font-bold=true font-italic=true font-size="14" height="20" tooltip="cannot have more than 20 dependents." text="bad Number. Must be less than 21" width="250" display="dynamic" controltovalidate="txtdependents" errormessage="number of dependents must be from 0 to 20" type="integer" minimumvalue=0 maximumvalue=10> </asp:rangevalidator></br> The ValidationSummary Control The ValidationSummary control enables us to display all errors in a given location. It displays the errormessage properties of respective controls in the summary report. Since the error messages are displayed in the summary, often we suppress the detailed error message in the individual ValidatorControls by placing an asterisk (*) or a short message right after the validator control s start-tag. Major properties of the ValidationSummary control are the following: _ headertext This is simply a header. _ displaymode Displays the errors in one of the following ways: _ List _ BulletList (default) _ Singleparagraph _ ShowSummary: (True or False) This property can be used to display or hide the summary report programmatically. Figure 3.62 illustrates the use of a ValidationSummary control. In our example, we have defined the ValidationSummary control as follows. <asp:validationsummary id="valsummary" runat="server" headertext="please correct the following errors" display="static" showsummary= "True" /> Figure 3.62 Using the ValidationSummary Control

$Figure 3.63 The Complete Code for the Application (Validator8.aspx) <! - Chapter3\Validator8.$

10 Figure 3.63 The Complete Code for the Application (Validator8.aspx) <! - Chapter3\Validator8.aspx > <%@ Page Language="VB" Debug="true" %> <html><head</head> <title>example on ValidationSummary control </title> <body><form runat="server"> Enter Your Name: <asp:textbox id="txtname" rows="1" width="100" runat="server"/> <asp:requiredfieldvalidator id="validtxtname" runat="server" controltovalidate="txtname" errormessage="name must be entered" display="static">* </asp:requiredfieldvalidator></br> Hours worked? <asp:textbox id="txth" width ="60" runat="server" /> <asp:requiredfieldvalidator id="validtxth" runat="server" controltovalidate="txth" errormessage="hours must be entered" display="static">* </asp:requiredfieldvalidator> <asp:regularexpressionvalidator id="regvh" runat="server" display="static" controltovalidate="txth" errormessage="hours must be 1-3 digits only" validationexpression="\d{1,3}">* </asp:regularexpressionvalidator></br> Hourly Rate? <asp:textbox id="txtr" width ="60" runat="server" /> <asp:comparevalidator id="comvr" runat="server" display="static" controltovalidate="txtr" errormessage="rate must be numeric" type="double" operator="datatypecheck">* </asp:comparevalidator></br> Number of Dependents: <asp:textbox id="txtdependents" width ="60" runat="server" /> <asp:rangevalidator id="ranvdependents" runat="server" backcolor="salmon" forecolor="blue" bordercolor="green" borderstyle="solid" borderwidth="5" font-bold="true" font-italic="true" font-size="14" height="20" tooltip="cannot have more than 20 dependents." text="bad Number. Must be less than 21" width="250" display="dynamic" controltovalidate="txtdependents" errormessage= "Number of dependents must be from 0 to 20" type="integer" minimumvalue="0" maximumvalue="10">* </asp:rangevalidator><br> What is your Department Number? <asp:textbox id="txtdeptnum" width ="60" runat="server" /> <asp:customvalidator id="cusvdeptnum" runat="server" display="dynamic" controltovalidate="txtdeptnum" onservervalidate="validatedeptnum" ClientValidationFunction="checkModTen" errormessage= "Dept. Number must be a multiple of 10" >* </asp:customvalidator><br> <asp:button id="btnsubmit" runat="server" text="submit"/><br><br> <asp:validationsummary id="valsummary" runat="server" headertext="please correct the following errors" display="static" showsummary= "True" /><br>

11 </form></body></html> <script language="vb" runat="server"> Sub validatedeptnum(source As Object, s as ServerValidateEventArgs) If (CInt(s.Value) Mod 10)=0 Then s.isvalid= True Else s.isvalid =False End If End Sub </script> <script language="javascript"> function checkmodten(source, s) { var y=parseint(s.value); if (isnan(y) &&!((y % 10) == 0)) s.isvalid=false; else s.isvalid=true; } </script>

(IT. Validation Controls ASP.NET.

(IT. Validation Controls ASP.NET. (IT Validation Controls ASPNET Email-nabil299@gmailcom PostBack Client-Side PostBack (JScript ) Client-Side Server-Side Validation JScript ASPNET Validation controls ToolBox Validation tab Validation controls