Using a change event for text field

Question

I am using a jQuery plugin that provides rulesets for visually displaying the quality of a user's typed in password.

This is a JSFIDDLE to see how that plugin works.

This is working fine for me. But I have a question, when I am typing a password the visual progress bar is working. but when I paste some text to password field its progress bar is not working.

can any body tell me, can we update this plugin to fix this issue.

I use this jQuery -

jQuery(document).ready(function () {
    var options = {
        onLoad: function () {
            $('#messages').text('Start typing password');
        },
        onKeyUp: function (evt) {
            $(evt.target).pwstrength("outputErrorList");
        }
    };
    $(':password').pwstrength(options);
});

Hope somebody may help me out. Thank you.

http://stackoverflow.com/questions/237254/how-do-you-handle-oncut-oncopy-and-onpaste-in-jquery — Bharadwaj, Jan 12 '15 at 03:21
[Detect all changes to a (immediately) using JQuery](http://stackoverflow.com/questions/1948332/detect-all-changes-to-a-input-type-text-immediately-using-jquery) — Cᴏʀʏ, Jan 12 '15 at 03:22

Josh Crozier · Accepted Answer · 2015-01-12T03:41:30.580

3

Based on the plugin documentation, you can force an update using .pwstrength("forceUpdate").

Just add an event listeners for the paste/change events, then update the password's strength using the method.

$(':password').on('paste change', function () {
    $(this).pwstrength("forceUpdate");
});

If you want to update the password's strength when programically changing the password (i.e., clearing it), all you would have to do is trigger a change event on the input element. For example:

$('#clear').on('click', function () {
    $('#password').val('').change();
});

Updated Example

edited Jan 12 '15 at 03:41

answered Jan 12 '15 at 03:28

Josh Crozier

233,099
56
391
304

Thank you for your answer. This is working when I paste something into my password field. But when I insert some text into my password field click on a button then this progress bar not working.. – TNK Jan 12 '15 at 03:35
like this - `if (linkId == 'generate'){ $('#password').val(password); $('#random').empty(); ` – TNK Jan 12 '15 at 03:36
I am using a password generator. when an user generated a password there is a button named 'use password' when clicking this button the generated password must display on my password field. all these are working for me. – TNK Jan 12 '15 at 03:49
when inserting this generated password to my password field this progress bar is not working. – TNK Jan 12 '15 at 03:51
But when pasting some text as password into my password field this progress bar is working. So Josh Crozier, can you understand what I said? – TNK Jan 12 '15 at 03:52
This is not dear.. Can we chat regarding this? – TNK Jan 12 '15 at 03:54
@TNK We are talking. It's still unclear what you're asking, though. Do you mind preparing an example demonstrating what you are having trouble with? – Josh Crozier Jan 12 '15 at 03:55
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/68623/discussion-between-tnk-and-josh-crozier). – TNK Jan 12 '15 at 03:55

Using a change event for text field

1 Answers1