0

I'm adding a password strength function to my existing validate settings and I'm down to one last item that I'm not sure how best to accomplish. My error display looks like this:

highlight: function(label) {
   $(label).closest('.form-element').addClass('error').closest('.form-element').removeClass('success');
   $('#result').html('');/*removes any strength messages on failed validation*/
        },
success: function(label) {
        label
        .text('OK!').addClass('valid')
        .closest('.form-element').addClass('success');
        },

the id "result" is the password strength message. So when a validation error (range length, required) etc. is triggered any message regarding the strength of the password is hidden.

The relevant portion password strength check is this:

if (strength < 2 ){
        $('#result').removeClass();
        $('#result').addClass('passwordWeak');
    return '(Password is weak)'
} else if (strength == 2) {
    $('#result').removeClass();
    $('#result').addClass('passwordGood');
    return '(Password is good)'
} else {
    $('#result').removeClass();
    $('#result').addClass('passwordStrong');
    return '(Password is strong)'
}
};

What I'd like to have happen is if any of the validate errors are shown, don't show one of these errors. They way I'm triggering it is enter 3 characters (shows "password is weak"), tab to next field (which fires the validate error on minimum length not 6 and hides "password is weak"), and then go back to add more characters to the password I still have the validate error message but as soon as I key up on character 4 I get the "password is weak". I only one those ratings to show if no errors from validate are currently showing.

The generated error label for validate looks like this:

<label class="error" for="thispassword" generated="true">Password must be between 6 and 50 characters.</label>
4

1 回答 1

0

这是我解决它的方法(暂时)。在密码字段的 keyup() 中,我添加了两行 - 一行隐藏生成的错误标签(由 validate 生成),另一行删除实际输入字段上的错误类:

$('#thispassword').keyup(function () {
    //$('label.error').hide();
    // prev hids all error labels following just gets the one we want
    $('#result').prev('label.error').hide();
    $(this).closest('.form-element').removeClass('error');
    $('#result').html(checkStrength($('#thispassword').val()));
});
于 2013-06-18T22:01:52.413 回答