Popular Posts

Sunday, 15 September 2013

ASP.NET VALIDATION (CLIENT SIDE)

ASP.NET VALIDATION CLIENT SIDE


There are several validates provided by the asp.net toolbox that can be used for validation the client input on client side.These are:

1.<asp:requiredfieldvalidator runat="server" errormessage="RequiredFieldValidator"></asp:requiredfieldvalidator>

2.<asp:rangevalidator runat="server" errormessage="RangeValidator"></asp:rangevalidator>

3.<asp:regularexpressionvalidator runat="server" errormessage="RegularExpressionValidator"></asp:regularexpressionvalidator>

4.<asp:comparevalidator runat="server" errormessage="CompareValidator"></asp:comparevalidator>

5.<asp:customvalidator runat="server" errormessage="CustomValidator"></asp:customvalidator>

6.<asp:validationsummary runat="server"></asp:validationsummary>

7.<cc1:DynamicValidator ID="DynamicValidator1" runat="server"></cc1:DynamicValidator>

Let see through an example how we can use them:



THE DESIGN PAGE:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Validation.aspx.cs" Inherits="Validation" %>

<%@ Register Assembly="System.Web.DynamicData, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.DynamicData" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">

    <title>Validation Demonstration</title>

    <script language=javascript>
        function MyClientsideValidator(source, args) {
            if (args.Value.indexOf("buzz") == -1) {
                args.IsValid = false;
            }
            else {
                args.IsValid = true;
            }
        }
    </script>

</head>

<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td style="width: 118px">
                    <asp:Label ID="NameLabel" runat="server" Text="Name"></asp:Label></td>
                <td>
                    <asp:TextBox ID="NameTextBox" runat="server" ValidationGroup="ValidationGroup1"></asp:TextBox></td>
                <td style="width: 403px">
                    &nbsp;<asp:RequiredFieldValidator ID="NameRequiredFieldValidator" runat="server"
                        ControlToValidate="NameTextBox" Display="Dynamic" ErrorMessage="Name required"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">
                        <img src="Error.gif" alt="*"  />
                    </asp:RequiredFieldValidator></td>
            </tr>
            <tr>
                <td style="width: 118px">
                    <asp:Label ID="AgeLabel" runat="server" Text="Age"></asp:Label></td>
                <td>
                    <asp:TextBox ID="AgeTextBox" runat="server" ValidationGroup="ValidationGroup1"></asp:TextBox></td>
                <td style="width: 403px">
                    &nbsp;<asp:RequiredFieldValidator ID="AgeRequiredFieldValidator" runat="server" ControlToValidate="AgeTextBox"
                        Display="Dynamic" ErrorMessage="Age required" SetFocusOnError="True" ValidationGroup="ValidationGroup1">Age required</asp:RequiredFieldValidator>
                    <asp:RangeValidator ID="AgeRangeValidator" runat="server" ControlToValidate="AgeTextBox"
                        Display="Dynamic" ErrorMessage="Age must be between 18 and 65 inclusive" MaximumValue="65"
                        MinimumValue="18" SetFocusOnError="True" Type="Integer" ValidationGroup="ValidationGroup1">Age must be between 18 and 65</asp:RangeValidator></td>
            </tr>
            <tr>
                <td style="width: 118px">
                    <asp:Label ID="EnrolmentLabel" runat="server" Text="Enrolment date"></asp:Label></td>
                <td>
                    <asp:TextBox ID="EnrolmentTextBox" runat="server" ValidationGroup="ValidationGroup1"></asp:TextBox></td>
                <td style="width: 403px">
                    &nbsp;<asp:RequiredFieldValidator ID="EnrolmentRequiredFieldValidator" runat="server"
                        ControlToValidate="EnrolmentTextBox" Display="Dynamic" ErrorMessage="Enrolment date required"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">Enrolment date required</asp:RequiredFieldValidator>
                    <asp:RangeValidator ID="EnrolmentRangeValidator" runat="server" ControlToValidate="EnrolmentTextBox"
                        Display="Dynamic" ErrorMessage="Enrolment date out of range" MaximumValue="09-09-2013"
                        MinimumValue="01-01-2013" SetFocusOnError="True" Type="Date" ValidationGroup="ValidationGroup1">Enrolment date out of range!!SHOULD BE BETWEEN "01/01/2013" & "09/09/2013"</asp:RangeValidator></td>
            </tr>
            <tr>
                <td style="width: 118px">
                    <asp:Label ID="PasswordLabel" runat="server" Text="Password"></asp:Label></td>
                <td>
                    <asp:TextBox ID="PasswordTextBox" runat="server" TextMode="Password" Width="149px" ValidationGroup="ValidationGroup1"></asp:TextBox></td>
                <td style="width: 403px">
                    &nbsp;<asp:RequiredFieldValidator ID="PasswordRequiredFieldValidator" runat="server"
                        ControlToValidate="PasswordTextBox" Display="Dynamic" ErrorMessage="Password required"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">Password required</asp:RequiredFieldValidator>
                    <asp:CompareValidator ID="PasswordCompareValidator" runat="server" ControlToValidate="PasswordTextBox"
                        Display="Dynamic" ErrorMessage="Please choose a more cryptic password :-}" Operator="NotEqual"
                        SetFocusOnError="True" ValueToCompare="password" ValidationGroup="ValidationGroup1">Please choose a more cryptic password :-}</asp:CompareValidator></td>
            </tr>
            <tr>
                <td style="width: 118px; height: 26px;">
                    <asp:Label ID="ConfirmLabel" runat="server" Text="Confirm"></asp:Label></td>
                <td style="height: 26px">
                    <asp:TextBox ID="ConfirmTextBox" runat="server" TextMode="Password" Width="149px" ValidationGroup="ValidationGroup1" ></asp:TextBox></td>
                <td style="width: 403px; height: 26px;">
                    &nbsp;<asp:RequiredFieldValidator ID="CompareRequiredFieldValidator" runat="server"
                        ControlToValidate="ConfirmTextBox" Display="Dynamic" ErrorMessage="Password confirmation required"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">Password confirmation required</asp:RequiredFieldValidator>
                    <asp:CompareValidator ID="ConfirmCompareValidator" runat="server" ControlToCompare="PasswordTextBox"
                        ControlToValidate="ConfirmTextBox" Display="Dynamic" ErrorMessage="Password confirmation mismatch"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">Password confirmation mismatch</asp:CompareValidator></td>
            </tr>
            <tr>
                <td style="width: 118px">
                    <asp:Label ID="EmailLabel" runat="server" Text="Email address"></asp:Label></td>
                <td>
                    <asp:TextBox ID="EmailTextBox" runat="server" ValidationGroup="ValidationGroup1"></asp:TextBox></td>
                <td style="width: 403px">
                    &nbsp;<asp:RequiredFieldValidator ID="EmailRequiredFieldValidator" runat="server"
                        ControlToValidate="EmailTextBox" Display="Dynamic" ErrorMessage="Email address required"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">Email address required</asp:RequiredFieldValidator>
                    <asp:RegularExpressionValidator ID="EmailRegularExpressionValidator" runat="server"
                        ControlToValidate="EmailTextBox" Display="Dynamic" ErrorMessage="Invalid email address"
                        SetFocusOnError="True" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="ValidationGroup1">Invalid email address</asp:RegularExpressionValidator></td>
            </tr>
            <tr>
                <td style="width: 118px">
                    <asp:Label ID="SecurityCodeLabel" runat="server" Text="Security code"></asp:Label></td>
                <td>
                    <asp:TextBox ID="SecurityCodeTextBox" runat="server" ValidationGroup="ValidationGroup1"></asp:TextBox></td>
                <td style="width: 403px">
                    &nbsp;<asp:CustomValidator ID="SecurityCodeCustomValidator" runat="server" ClientValidationFunction="MyClientsideValidator"
                        ControlToValidate="SecurityCodeTextBox" Display="Dynamic" ErrorMessage="Invalid security code"
                        SetFocusOnError="True" ValidateEmptyText="True" OnServerValidate="SecurityCodeCustomValidator_ServerValidate" ValidationGroup="ValidationGroup1">Invalid security code</asp:CustomValidator></td>
            </tr>
        </table>
   
    </div>
   
        <asp:Button ID="SubmitButton" runat="server" Text="Submit" OnClick="SubmitButton_Click" ValidationGroup="ValidationGroup1" /> <br />
        <asp:Label ID="ResultLabel" runat="server"></asp:Label><br /><br />
        <asp:ValidationSummary ID="ValidationSummary1" runat="server" HeaderText="Please fix these errors on the page:" ValidationGroup="ValidationGroup1" ShowMessageBox="True" />
        <br /><br />
        <asp:Panel ID="Panel1" runat="server" Height="50px" Width="690px">
            <asp:TextBox ID="TextBox1" runat="server" ValidationGroup="ValidationGroup2"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
                ErrorMessage="RequiredFieldValidator" ValidationGroup="ValidationGroup2"></asp:RequiredFieldValidator>
            <asp:Button ID="Button1" runat="server" Text="Button" ValidationGroup="ValidationGroup2" /></asp:Panel>

    </form>
</body>
</html>



IMG FOR ALL ERROR SHOWN:







1.REQUIRED FIELD VALIDATOR:

AS the name suggest For putting any value in the textfiled compulsory this validator is used.
Eg:
<asp:RequiredFieldValidator ID="NameRequiredFieldValidator" runat="server"
                        ControlToValidate="NameTextBox" Display="Dynamic" ErrorMessage="Name required"
                        SetFocusOnError="True" ValidationGroup="ValidationGroup1">
                        <img src="error.gif" alt="*"  />
                    </asp:RequiredFieldValidator>
Here to show the error we can also use the image,,with the help of img tag Used.
Other attributes are common and defines their own function......


VALIDATION GROUP:
It is used to specifies the cluster which will act on one event occurence.



2.RANGE VALIDATOR :

<asp:RangeValidator ID="AgeRangeValidator" runat="server" ControlToValidate="AgeTextBox"
                        Display="Dynamic" ErrorMessage="Age must be between 18 and 65 inclusive" MaximumValue="65"
                        MinimumValue="18" SetFocusOnError="True" Type="Integer" ValidationGroup="ValidationGroup1">Age must be between 18 and 65</asp:RangeValidator></td>


This is used to specifie/restrict the input from the user.
Here we are allowing user to only enter numeric number from 18 to 65 only......with the help of  Type="Integer".


3.COMPARE VALIDATOR :
  
<asp:CompareValidator ID="PasswordCompareValidator" runat="server" ControlToValidate="PasswordTextBox"
                        Display="Dynamic" ErrorMessage="Please choose a more cryptic password :-}" Operator="NotEqual"
                        SetFocusOnError="True" ValueToCompare="password" ValidationGroup="ValidationGroup1">Please choose a more cryptic password :-}</asp:CompareValidator></td>

Compare validator is used to compare one value in one textbox with another.
Here passowrd have been checked.


4.REGULAR EXPRESSION VALIDATOR :


<asp:RegularExpressionValidator ID="EmailRegularExpressionValidator" runat="server"
                        ControlToValidate="EmailTextBox" Display="Dynamic" ErrorMessage="Invalid email address"
                        SetFocusOnError="True" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="ValidationGroup1">Invalid email address</asp:RegularExpressionValidator></td>
      
This can be modified as required.here it checks the email enterd by the user by the VALIDATIONEXPRESSION......


5.CUSTOM VALIDATOR :
               
<asp:CustomValidator ID="SecurityCodeCustomValidator" runat="server" ClientValidationFunction="MyClientsideValidator"
                        ControlToValidate="SecurityCodeTextBox" Display="Dynamic" ErrorMessage="Invalid security code"
                        SetFocusOnError="True" ValidateEmptyText="True" OnServerValidate="SecurityCodeCustomValidator_ServerValidate" ValidationGroup="ValidationGroup1">Invalid security code</asp:CustomValidator>

If none of the other validators can help you, the CustomValidator usually can. It doesn't come with a predefined way of working; you write the code for validating your self. This is of course very powerful, since the possibilities are basically endless. 

Here  we have created a security check that will check the code/letter written by the user,on the server side .
protected void SecurityCodeCustomValidator_ServerValidate(object source, ServerValidateEventArgs args)
    {
        if (args.Value.IndexOf("buzz") == -1)
        {
            args.IsValid = false;
        }
        else
        {
            args.IsValid = true;
        }
    }
When user enters buzz keyword only then the code is accepted else error msg will be shown.


6.VALIDATION SUMMARY :
The ValidationSummary control is used to display a summary of all validation errors occurred in a Web page.
The error message displayed in this control is specified by the ErrorMessage  property of each validation control. If the ErrorMessage property of the validation control is not set, no error message is displayed for that validation control.
<asp:ValidationSummary ID="ValidationSummary1" runat="server" HeaderText="Please fix these errors on the page:" ValidationGroup="ValidationGroup1" ShowMessageBox="True" />
     
ShowMessageBox="True" make the display box to be appeared with all the error details.









HENCE YOUR PROBLEM SOLVED..............................
So JUST COPY AND (!!!!UNDERSTAND.......) AND GET AMAZED ON YOUR INTELLIGENCE
IF ANY ERROR OR SUGGESTION IS, ALWAYS WELCOME....................................................................
THANKS FOR BEARING..............................................................................................................................



No comments :

Post a Comment