Wednesday, July 14, 2010

Asp.Net Client side Validation using Java Script

This simple program will guide how to do client side validation of Form in

In this just make a form as follows:

  • Name : <asp:TextBox ID="txtName" />
  • Email : <asp:TextBox ID="txtEmail" />
  • Web URL : <asp:TextBox ID="txtWebUrl" />
  • Zip : <asp:TextBox ID="txtZip" />
  • <asp:Button ID="btnSubmit" OnClientClick=" return validate()" runat="server" Text="Submit" />

  • Now on the sourcecode of this form in script tag write the following code:

    <script language="javascript" type="text/javascript">
    function
    validate()
    {
    if (document.getElementById("<%=txtName.ClientID%>").value==""
    )
    {
    alert("Name Feild can not be blank"
    );
    document.getElementById(
    "<%=txtName.ClientID%>"
    ).focus();
    return false
    ;
    }
    if(document.getElementById("<%=txtEmail.ClientID %>").value==""
    )
    {
    alert(
    "Email id can not be blank"
    );
    document.getElementById("<%=txtEmail.ClientID %>"
    ).focus();
    return false
    ;
    }
    var
    emailPat = /^(\".*\"|[A-Za-z]\w*)@(\[\d{1,3}(\.\d{1,3}){3}]|[A-Za-z]\w*(\.[A-Za-z]\w*)+)$/;
    var emailid=document.getElementById("<%=txtEmail.ClientID %>"
    ).value;
    var
    matchArray = emailid.match(emailPat);
    if (matchArray == null
    )
    {
    alert(
    "Your email seems incorrect. Please try again."
    );
    document.getElementById(
    "<%=txtEmail.ClientID %>"
    ).focus();
    return false
    ;
    }
    if(document.getElementById("<%=txtWebURL.ClientID %>").value==""
    )
    {
    alert(
    "Web URL can not be blank"
    );
    document.getElementById(
    "<%=txtWebURL.ClientID %>").value=
    "http://"
    document.getElementById("<%=txtWebURL.ClientID %>"
    ).focus();
    return false
    ;
    }
    var Url=
    "^[A-Za-z]+://[A-Za-z0-9-_]+\\.[A-Za-z0-9-_%&\?\/.=]+$"
    var tempURL=document.getElementById("<%=txtWebURL.ClientID%>"
    ).value;
    var
    matchURL=tempURL.match(Url);
    if(matchURL==null
    )
    {
    alert(
    "Web URL does not look valid"
    );
    document.getElementById(
    "<%=txtWebURL.ClientID %>"
    ).focus();
    return false
    ;
    }
    if (document.getElementById("<%=txtZIP.ClientID%>").value==""
    )
    {
    alert(
    "Zip Code is not valid"
    );
    document.getElementById(
    "<%=txtZIP.ClientID%>"
    ).focus();
    return false
    ;
    }
    var digits="0123456789"
    ;
    var
    temp;
    for (var i=0;i"<%=txtZIP.ClientID %>"
    ).value.length;i++)
    {
    temp=document.getElementById(
    "<%=txtZIP.ClientID%>"
    ).value.substring(i,i+1);
    if
    (digits.indexOf(temp)==-1)
    {
    alert(
    "Please enter correct zip code"
    );
    document.getElementById(
    "<%=txtZIP.ClientID%>"
    ).focus();
    return false
    ;
    }
    }
    return true
    ;
    }
    script>

    And in code behind file just write the below code.

    protected void Page_Load(object sender, EventArgs e)
    {
    btnSubmit.Attributes.Add("onClick", " return validate()");


    }

    No comments:

    Post a Comment