0

I've implemented the jquery strengthify library (https://github.com/MorrisJobke/strengthify) to validate password strength along with a random password generator. The issue I'm having is that when a user typed a weak password and then decided to generate one, the strength checker doesn't re-evaluate the input and keeps the old validation failure.

I need help to reset the validation failure when a password was generated.

See below for code

...
<div class="password-group">
    <label for="UserPasswordInput">Password</label>
    <a href="#" id="generatePassword">Generate</a>
    <input name="user_password" type="text" class="password-field" id="UserPasswordInput">
</div>
...
<script>
$(document).ready(function() {
    $('#generatePassword').click(function (e) {
        password = $.password(10);
        $('.password-field').val(password);
        e.preventDefault();
    });
    $('.password-field').strengthify({
        zxcvbn: 'https://cdn.rawgit.com/dropbox/zxcvbn/master/dist/zxcvbn.js',
        drawTitles: true,
        drawMessage: true
    });
});
</script>

https://jsfiddle.net/wo4tzLn1/1/

Riaan van Staden
  • 5
  • 2

1 Answers1

1

I would try to trigger change:

$('#generatePassword').click(function (e) {
    password = $.password(10);

    $('.password-field').val(password);
    
    // CHANGE HERE
    $('.password-field').trigger("change");

    e.preventDefault();
});

Details - val() doesn't trigger change() in jQuery

Demo - https://jsfiddle.net/vyspiansky/7p3ace1d/

Ihor Vyspiansky
  • 918
  • 1
  • 6
  • 11