CODEWITHSUNDEEP
javascript
stackers
stackers

Reputation: 385

javascript password match if not match show in innerHTML

hi you write that code that is helpful for me but i want to show message in innerHTML when password not match how to do this i am trying but not working for me.below is my code .please guide me. i am beginner learner.

                if (pwd != cpwd) {

                 document.getElementById("pwd").innerHTML="password must be match";
     document.getElementById("cpwd").innerHTML="password must be match";
     document.getElementById("pwd").style.color="RED";

      return false;

}

i want to know about how to exactly write in innerHTML

below your code 

               <input id="pass1" type="password" placeholder="Password" style="border-radius:7px; border:2px solid #dadada;" /> <br />
               <input id="pass2" type="password" placeholder="Confirm Password" style="border-radius:7px; border:2px solid #dadada;"/> <br />

 <script>
function myFunction() {
    var pass1 = document.getElementById("pass1").value;
    var pass2 = document.getElementById("pass2").value;
    if (pass1 != pass2) {
        //alert("Passwords Do not match");
        document.getElementById("pass1").style.borderColor = "#E34234";
        document.getElementById("pass2").style.borderColor = "#E34234";
    }
    else {
        alert("Passwords Match!!!");
    }
}

Sumbit

Thanks for advance waiting for your appreciate answer.

Upvotes: 0

Views: 2231

Answers (2)

Nir Alfasi
Nir Alfasi

Reputation: 53535

You should use the event onBlur tied to the field "pass2" in order trigger the first code snippet attached to your question.

For example:

document.getElementById("pass2").onblur=function(){
    var pass1 = document.getElementById("pass1").value;
    var pass2 = document.getElementById("pass2").value;
    if (pass1 != pass2) {
      document.getElementById("pass1").innerHTML="password must be match";
      document.getElementById("pass2").innerHTML="password must be match";
      document.getElementById("pass1").style.color="RED";
      return false;
     }
     return true;    
};

Another option is to tie it to the submit button.

Upvotes: 1

codetantrik
codetantrik

Reputation: 315

Add a div to store your password validation response to the document like <div id='validate'></div> and then after you have checked for passwords match, you can display the appropriate result in the html of this div document.getElementById('validate').innerHTML="passwords do not match!";

Upvotes: 0

Related Questions