recheck password character by character while typing

Question

I'm working on recheck password while typing.Can anyone help me with the code that checks while typing password that shows a notification if it doesn't match entirely character by character while typing and that checks the length too when submit button is pressed in jquery or javascript

Duplicate of https://stackoverflow.com/questions/9717588/checking-password-match-while-typing — Sagar, Jun 28 '17 at 05:28
Possible duplicate of [Checking password match while typing](https://stackoverflow.com/questions/9717588/checking-password-match-while-typing) — Sagar, Jun 28 '17 at 05:29
I have tried that code but I need something that checks code while typing and length after submission and till then it shouldn't display passwords donot match till submitted if it's the case of length — Alapati, Jun 28 '17 at 05:35
Then just add a flag of incorrect password which will trigger alert on form submission. — Sagar, Jun 28 '17 at 05:40
just want to know how to check a string character by character in jquery — Alapati, Jun 28 '17 at 05:43

score 0 · Answer 1 · answered Jun 28 '17 at 05:31

You can do this by several ways. This DEMO will solve your problem by using Jquery validation.

HTML

<form class="validatedForm" id="commentForm" method="get" action="">
<fieldset>
    <input name="user[password]" id="user_password" required/><br>
    <input name="user[password_confirmation]" required/>
</fieldset>
</form>
<button>Validate</button>

JQuery

jQuery('.validatedForm').validate({
rules: {
    "user[password]": {
        minlength: 3
    },
    "user[password_confirmation]": {
        minlength: 3,
        equalTo : "#user_password"
        }
    }
});

$('button').click(function () {
  console.log($('.validatedForm').valid());
});

score 0 · Answer 2 · answered Jun 28 '17 at 05:46

Original answer - https://stackoverflow.com/a/9717644/7643022

That answer gives you the solution to what you need. I have just modified the answer to what you desire.

html

<div class="td">
    <input type="password" id="txtNewPassword" />
</div>
<div class="td">
    <input type="password" id="txtConfirmPassword" onChange = "checkPasswordMatch();" />
</div>
    <div class="registrationFormAlert" id="divCheckPasswordMatch">
</div>
<div><input type="submit" id="submitbtn"/></div>

JQuery

var incorrectFlag = false;
function checkPasswordMatch() {
    var password = $("#txtNewPassword").val();
    var confirmPassword = $("#txtConfirmPassword").val();

    if (password != confirmPassword)
        incorrectFlag = true;
    else
        incorrectFlag = false;
}

$(document).ready(function () {
   $("#txtConfirmPassword").keyup(checkPasswordMatch);
   $("#submitbtn").onclick(function(e){
       e.preventDefault();
       if (incorrectFlag){
           alert("Password Incorrect");
       } else {
           $('form').submit();
       }
   });
});

score 0 · Answer 3 · answered Jun 28 '17 at 05:59

The Actual password should be retrieved and stored somewhere, here I assumed it should be stored in the hidden input.

$(document.ready(
    var actual_password = $("#hidden_input_password").val();
    $( "#password_text_box" ).keyup(function(event) {
          var input_Password = $(this).val();
          if(input_Password.length > actual_password.length)
          {
              event.preventDefault();
              event.stopPropogation();
              return;
          }
          elseif(input_Password.length === actual_password.length){
              if(input_Password===actual_password) 
              {
                 return;
              }  
              else{
                event.preventDefault();
                event.stopPropogation();
                $(this).addClass("notification");
                return;
              }
           } 
           else{
                     if(input_Password!===actual_password.slice(0,input_Password.length))
    {
                event.preventDefault();
                event.stopPropogation();
                $(this).addClass("notification");
                return;

     }
           }
    });
    );

recheck password character by character while typing

3 Answers3

html

JQuery