How to Validate Asp.net Password and Confirm Password in JQuery

Erukulla's 23:27:00

In these Tutorials we see Validate Asp.net Password and Confirm Password in JQuery and in my previous articles i explained about How to Validate Email-ID through JQuery and another article is Hide Div Tag when Button Click Event by Using JQuery.In above Image we see 4 Point...

  1. TextBox doesn't allow blank, if it's blank beside of textbox show error message.
  2. Error Message will be disappear when you enter password
  3. If Password and Confirm Password not matching, Error Message Password Not Matching... will be display on above Textbox.
  4. if Password and Confirm Password matching, Password Matching... will display on above Textbox.

HTML Markup : Create Password & Confirm Password Page

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Email Address Validation.aspx.cs" Inherits="JQUERY_TUTORIALS_Email_Address_Validation" %>
<!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 runat="server">
    <title></title>
           
  -----   ADD JQUERY CODE HERE    -----

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table>
    <tr>
    <td>
        <asp:Label ID="lblerror" runat="server" Text=""></asp:Label></td>
    </tr>
     <tr>
      <td>
          <asp:TextBox ID="txt_pwd" runat="server" TextMode="Password" placeholder="password..."></asp:TextBox><asp:Label ID="lblerror_pwd" runat="server" Text=""></asp:Label></td>
     </tr>
     <tr>
     <td><asp:TextBox ID="txt_conf_pwd" runat="server"  TextMode="Password" placeholder="Confirm password..."></asp:TextBox><asp:Label ID="lblerror_conf_pwd" runat="server" Text=""></asp:Label></td>
     </tr>
    </table>
    </div>
    </form>
</body>
</html>

JQuery Code for Password & Confirm Password

  <script type="text/javascript">
        $(document).ready(function () {
            $('[id$=txt_pwd]').focusout(function () {
                if ($('[id$=txt_pwd]').val() == "") {
                    $('[id$=lblerror_pwd]').html("Please Enter Password");
                }
                else
                $('[id$=lblerror_pwd]').html(" ");
            });
            $('[id$=txt_conf_pwd]').focusout(function () {
                if ($('[id$=txt_conf_pwd]').val() == "") {
                    $('[id$=lblerror_conf_pwd]').html("Please Enter Confirm Password");
                } else
                    $('[id$=lblerror_conf_pwd]').html(" ");

                if ($('[id$=txt_conf_pwd]').val() != "") {
                    var pwd = $('[id$=txt_pwd]').val();
                    var conf_pwd = $('[id$=txt_conf_pwd]').val();
                    if (conf_pwd == pwd) {
                        $('[id$=lblerror]').html("Password Matching...");
                    }
                    else {
                        $('[id$=lblerror]').html("Password Not Matching...");
                        return false;
                    }
                }
            });
        });
    </script>
Reactions

Post a Comment

0 Comments