twitter bootstrap - password validation using jquery issue -


i have app validating passwords. have popup(bootstrap) lists rules , change x check based on meeting conditions. working fine except 1 scenario.

i type in password1 , check happens , fine, type in 2nd password , fine. if move away password fields , come password field, invalid. technically matching password.(i tried change class glyphicon-ok in both password fields, issue reverse)

password fields

<form:input id="password1" type="password" class="form-control" path="password11"      title="password check" data-toggle="popover" data-placement="bottom" data-html="true"      data-content="<span id=&quot;char&quot; class=&quot;glyphicon glyphicon-remove&quot; style=&quot;color:#ff0004;&quot;></span>10-30chars</li></ul><br>"     />      <form:input id="password2" type="password" class="form-control" path="password22"          title="password check" data-toggle="popover" data-placement="bottom" data-html="true"          data-content="<span id=&quot;char&quot; class=&quot;glyphicon glyphicon-remove&quot; style=&quot;color:#ff0004;&quot;></span>password match</li></ul><br>"         /> 

js file

$(document).ready(function() {      //$("input[type=password]").keyup(function(){     //$("#element").on('keyup change', function ()     //$("input[type=password]").on('keyup focus focusout change', (function      $("input[type=password]").keyup(function(){          if(($("#password1").val().length >= 10) && ($("#password1").val().length <= 30)){             $("#char").removeclass("glyphicon-remove");             $("#char").addclass("glyphicon-ok");             $("#char").css("color","#");         }else{             $("#char").removeclass("glyphicon-ok");             $("#char").addclass("glyphicon-remove");             $("#char").css("color","#");         }            if($("#password1").val() == $("#password2").val()){             $("#pwmatch").removeclass("glyphicon-remove");             $("#pwmatch").addclass("glyphicon-ok");             $("#pwmatch").css("color","#");         }else{             $("#pwmatch").removeclass("glyphicon-ok");             $("#pwmatch").addclass("glyphicon-remove");             $("#pwmatch").css("color","#");         } });   }); 

so need able validate password , if move field , come should display right pop-up values(meaning if 2 passwords match, should see check, else x).

thanks.

i able working, though not elegant. added whole keyup function focus function(both 2 different functions now) , working fine now. tried chaining, did not work. fine , check on later. thanks.


Comments

Popular posts from this blog

java - Suppress Jboss version details from HTTP error response -

gridview - Yii2 DataPorivider $totalSum for a column -

Sass watch command compiles .scss files before full sftp upload -