Validation on old password field

Question

Stucked how to apply validation if old password not entered. Need validation if anyhow user forgot to enter the old password. Thanks in advance.

FIDDLE DEMO

$(document).ready(function() {
          $("#submitBtn").click(function(){
              validate();
          });
        });

        function validate() {
          var password1 = $("#password1").val();
          var password2 = $("#password2").val();
            if(password1 != password2) {
               $(".error-msg").html("Password and confirmation password do not match.").show();                    
            }
            else {
                $(".error-msg").html("").hide();  
                ValidatePassword();
            }
        }

        function ValidatePassword() {
          var regex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$@!%&*?])[A-Za-z\d#$@!%&*?]{8,}$/;
          var txt = document.getElementById("password1");
          if (!regex.test(txt.value)) {
              $(".error-msg").html("The password does not meet the password policy requirements.").show();
          } else {
              $(".error-msg").html("").hide();
              window.location.href='change-password-msg.html';
          }
        }

What exactly are you asking? This seems to be for a password-change form. In general, if the user can't provide the old password, you *shouldn't* consider them validated and shouldn't let them change the password. In any case, please clarify your question and provide a [mcve], along with an explanation of the problem you're having. — elixenide, Nov 02 '18 at 05:31

score 3 · Accepted Answer · answered Nov 02 '18 at 05:36

You have to check first that you old password input filled or not. Please see my code may be it can help you. See this live JSFiddle

HTML Code -

<div class="error-msg"></div>
<br><br>

<form>
  <div class="form-group">
    <label>OLD PASSWORD</label>
    <input name="oldPassword" id="oldPassword" type="password" class="form-control">
  </div>
  <div class="form-group">
    <label>NEW PASSWORD</label>
    <input type="password" id="password1" class="form-control">
  </div>
  <div class="form-group">
    <label>CONFIRM PASSWORD</label>
    <input type="password" id="password2" class="form-control">
  </div>
</form>
<button type="button" id="submitBtn" class="btn btn-primary">UPDATE</button>

CSS Code -

.error-msg {
  width: 100%;
  font-family: 'nobelregular';
  color: #ff0002;
  display: none;
}

JS Code -

$(document).ready(function() {
  $("#submitBtn").click(function() {
    var oldVal = $('#oldPassword').val() || "";
    if (oldVal == "") {
      $(".error-msg").html("First you have to fill Old Password.").show();
      return false;
    }
    validate();
  });
});

function validate() {
  var password1 = $("#password1").val();
  var password2 = $("#password2").val();
  if (password1 != password2) {
    $(".error-msg").html("Password and confirmation password do not match.").show();
  } else {
    $(".error-msg").html("").hide();
    ValidatePassword();
  }
}

function ValidatePassword() {
  var regex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$@!%&*?])[A-Za-z\d#$@!%&*?]{8,}$/;
  var txt = document.getElementById("password1");
  if (!regex.test(txt.value)) {
    $(".error-msg").html("The password does not meet the password policy requirements.").show();
  } else {
    $(".error-msg").html("").hide();
    window.location.href = 'change-password-msg.html';
  }
}

if we need the old password check from the db what to do than — dhS, Jul 04 '20 at 13:47
May be this can help you [how can I check my old password with new password](https://stackoverflow.com/questions/44153139/how-can-i-check-my-old-password-with-new-password). @dhS — Shubham Baranwal, Jul 05 '20 at 05:37

Asad · Answer 2 · 2018-11-02T05:43:54.160

$(document).ready(function() {
   $("#old-password").change(function(){
       var value = $("#old-password").val();
     if(value===''){
     alert("please enter Old Password");
     }
      
      });
          $("#submitBtn").click(function(){
              validate();
          });
        });

        function validate() {
         var value = $("#old-password").val();
           if(value===''){
           
           alert("please enter Old Password");
           }
          var password1 = $("#password1").val();
          var password2 = $("#password2").val();
            if(password1 != password2) {
               $(".error-msg").html("Password and confirmation password do not match.").show();                    
            }
            else {
                $(".error-msg").html("").hide();  
                ValidatePassword();
            }
        }

        function ValidatePassword() {
          var regex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$@!%&*?])[A-Za-z\d#$@!%&*?]{8,}$/;
          var txt = document.getElementById("password1");
          if (!regex.test(txt.value)) {
              $(".error-msg").html("The password does not meet the password policy requirements.").show();
          } else {
              $(".error-msg").html("").hide();
              window.location.href='change-password-msg.html';
          }
        }

.error-msg {
    width: 100%;
    font-family: 'nobelregular';
    color: #ff0002;
    display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="error-msg"></div>
<br><br>

<form>
  <div class="form-group">
    <label>OLD PASSWORD</label>
    <input type="password" id="old-password" class="form-control">
  </div>
  <div class="form-group">
    <label>NEW PASSWORD</label>
    <input type="password" id="password1" class="form-control">
  </div>
  <div class="form-group">
    <label>CONFIRM PASSWORD</label>
    <input type="password" id="password2" class="form-control">
  </div>
</form>
<button type="button" id="submitBtn" class="btn btn-primary">UPDATE</button>

you can do validation for old password like this snippet and you can also validate that password using ajax call if you want to validate old password at client side

Validation on old password field

2 Answers2