How I display progress bar for one password field? about jquery.pwstrength.bootstrap

[ablanco]

If I have understood your problem, what you need to do is to call the plugin only on the actual password input, instead of on both of them.

http://jsbin.com/vobixamaha/1/edit?html,js,output

Hope that helps. If not, feel free to reopen the issue.

[tharangakuma]

@ablanco yes you have understood my problem correctly. But one this is just I need to display this progress bar when typing actual password not confirm password.

Is it possible to do?
Thank you.

[ablanco]

In the link I put in my previous comment, the progress bar only updates when the user types in the actual password field, not the confirm one.

[tharangakuma]

yes.. its correct. but problem is I need to display this progress bar below the conform password field. Is it possible?

[ablanco]

Yes it is. You have to add a container under the confirm password, and pass a reference (or a selector) to the plugin using the viewport options. You can find more details about that option in the readme.

[tharangakuma]

There is another problem. It is, if an user can not create a strong password then he/she can create a computer generated password. Check my JSBin. There are two buttons one for generate the password and other one is to use the generated password. When this "use password" button click on the generated password is autofillling to my actual and confirm password fields. These are working for me.

But my problem is when updating this generating password then its progress bar is not working.
This is working for copy/paste and typed password, but not working for auto complete.

Hope you may help me out.
Thank You.

[ablanco]

The strength meter listen to some events to update itself. When you change the content through JS no event is fired, and that's why it doesn't update. You have to manually trigger the event. Do something like this in your code, just after changing the input value: $('#password').trigger('keyup');

[tharangakuma]

One problem is solved. But last one is still reaming. This is my updated JSbin -
http://jsbin.com/miyifufeza/1/edit

UPDATE :
According to your last comment I tried but then its not working at all
http://jsbin.com/vayitaxofo/1/edit?html,js,output

[ablanco]

http://jsbin.com/zinuvomeqe/1/edit?html,js,output

I added the line that triggers the event after updating the password field content.

[tharangakuma]

Thank you very much for your help. Since I am new to jquery its hard to understand that particular code..

[ablanco]

You are welcome. jQuery is easy, you will be up to speed in no time :)