How can jquery validation asp.net with c#


In this example we will explain the basics and widely used jQuery validation in ASP.Net Web Form. Using a library to do form validations can save much of your development time. The jQuery Form validation library is the most popular validation library and I think one of the easiest libraries to use in web forms.










  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="validate.aspx.cs" Inherits="_Default" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>   
    <!--include jQuery Validation Plugin-->  
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.min.js" type="text/javascript"></script>  
           <script type="text/javascript">
    
               $(document).ready(function() {
                   $("#form1").validate({
                       rules: {
                           <%=txtUserName.UniqueID %>: {
                            minlength: 5,
                            required: true
                        },
                        <%=txtPassword.UniqueID %>: {
                            minlength: 5,
                            required: true
                        },
                        <%=txtEmail.UniqueID %>: {
                            required: true
                        }
                    }, messages: {
                        <%=txtUserName.UniqueID %>:{
                            required: "Plaese enter your name",
                            minlength: "User name must be atleaet of 5 characters"
                        },
                        <%=txtPassword.UniqueID %>:{
                            required: "Plaese enter your password",
                            minlength: "Password must be atleaet of 5 characters"
                        },
                        <%=txtEmail.UniqueID %>:{
                            required: "Plaese enter your Email Id",
                        }                
                    }
                });
            });
        </script>
    </head>
    <body>
         <form id="form1" runat="server">
    
        <table width="50%" cellpadding="2" cellspacing="4" style="border: solid 1px navy;
            background-color: #d5d5d5;">
            <tr>
                <td colspan="2" align="center">
                    <b>Validation Example using JQuery</b>
                </td>
            </tr>
            <tr>
                <td align="right" width="75px">
                    User Name :
                </td>
                <td>
                    <asp:TextBox ID="txtUserName" runat="server" Width="180px"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td align="right">
                    Password :
                </td>
                <td>
                    <asp:TextBox ID="txtPassword" runat="server" TextMode="Password" Width="180px"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td align="right">
                    Email Id :
                </td>
                <td>
                    <asp:TextBox ID="txtEmail" runat="server" CssClass="email" Width="180px"></asp:TextBox>
                </td>
            </tr>   
            <tr>
                <td align="right">
                    &nbsp;
                </td>
                <td align="left">
                    <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
                </td>
            </tr>
        </table>
        </form>
    </body>
    </html>
    






Post a Comment

0 Comments