JQuery Password Validation affected to all input type password?

Question

I have 3 inputs on the HTML form: Old password, New password, and Retype New password. I use JQuery Password Validation plugin for New password field. But If three inputs were type of password, the plugin affected all three inputs. I want that it affect only one input (New password), how can I do that? The following is my code:

    // The following code is in an UserControl, the form is in the page containt this control
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <script type="text/javascript">
        // This script is for validation
            Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(CheckValidationStatus);
            function CheckValidationStatus(sender, args) { { var isValid = $("form").validate().form(); args.set_cancel(!isValid); } }
        </script>

    <table class="listing form" cellpadding="0" cellspacing="0">
        <tr>
            <td class="first"><strong>Old password:</strong></td>
            <td class="last ofield">
                <asp:TextBox ID="txtOldPassword" runat="server" CssClass="text required"  TextMode="Password"></asp:TextBox>
            </td>
        </tr>
        <tr  class="bg">
            <td class="first" width="172"><strong>New password:</strong></td> 
            <td class="last pwdfield">
                 <asp:TextBox ID="tNewPassword" runat="server" CssClass="text password"  TextMode="Password" ></asp:TextBox>
                 <span>Password strength</span>
                 <div class="password-meter">
                     <div class="password-meter-message">Quá ng?n</div>
                     <div class="password-meter-bg">
                         <div class="password-meter-bar"></div>
                     </div>
                 </div>
            </td>
        </tr>
        <tr>
            <td class="first"><strong>Retype Password:</strong></td>
            <td class="last ofield"><asp:TextBox ID="txtRetypePassword" runat="server" CssClass="text" TextMode="Password" ></asp:TextBox></td>
        </tr>
</table>

<p style="text-align:right">
   <asp:Button ID="Button1" runat="server" Text="Update" />
</p>

</ContentTemplate>
</asp:UpdatePanel>

What is your code look like? Which jquery selector is used?

denolk
– denolk

2012-02-22 11:38:32 +00:00
Commented Feb 22, 2012 at 11:38 — denolk
– denolk, Commented Feb 22, 2012 at 11:38
Please see my code above

Binh Nguyen Thanh
– Binh Nguyen Thanh

2012-02-22 12:11:02 +00:00
Commented Feb 22, 2012 at 12:11 — Binh Nguyen Thanh
– Binh Nguyen Thanh, Commented Feb 22, 2012 at 12:11

Trevor Herr · Accepted Answer · 2012-05-07 21:00:23Z

2

The issue is that the password validation plugin adds a new validation method called "password".

$.validator.addMethod("password", function(value, element, usernameField) {

One of the ways the jQuery validation plugin determines what validation methods it should call is by checking if the method name is equal to the fields type. In this case the type of all your elements are password (set by TextMode="Password"), same as the new method that was added.

The work around is to change the method name in the password validation plugin to something else.

$.validator.addMethod("passwordstrength", function(value, element, usernameField) {

You also have to change when the method is registered with the validation plugin to the new method name.

$.validator.classRuleSettings.password = { passwordstrength: true };

Now only fields that have the password class will be validated.

answered May 7, 2012 at 21:00

Trevor Herr

652 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

MHTri Over a year ago

Thank you! This has been the bane of my life for a couple of weeks!

kubum · Accepted Answer · 2012-02-22 11:40:09Z

1

Add id to your "New password" field (id="newpassword") and specify this id for jQuery Password Validation plugin.

Something like this:

$("#newpassword").validate();

answered Feb 22, 2012 at 11:40

kubum

4692 silver badges13 bronze badges

1 Comment

Binh Nguyen Thanh Over a year ago

Dont know how to apply because of something. Please see my code (updated above).

napolux · Accepted Answer · 2012-02-22 11:39:00Z

0

Don't know the plugin, but I think you can easily change it to apply validation only on your specific input (assign to it a unique id). Or better you can pass the ID of your new password input to the plugin and make it validate only that input.

answered Feb 22, 2012 at 11:39

napolux

16.2k9 gold badges55 silver badges72 bronze badges

Collectives™ on Stack Overflow

JQuery Password Validation affected to all input type password?

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related