How To Validate Password And Confirm Password Using JQuery

Websolutionstuff | Sep-02-2020 | Categories : PHP jQuery HTML

In this article, we see how to validate password and confirm password using jQuery. Validation is a basic and important feature for authentication users. So here we will give you a demo about passwords and confirm password validation using jquery.

So, let's see how to check password and confirm password using jquery validation and how to match password and confirm password using jquery or javascript.

In jquery, we are using the keyup event to check whether the password and confirm the password is a match or not.

<html>
  <body>
      <head>
        <meta charset="utf-8">
        <title>How to validate password and confirm password in jquery - websolutionstuff.com</title>
        <link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
      </head>
      <div class="row">
        <div class="col-md-6 col-md-offset-3">
          <h1>How to validate password and confirm password in jquery - websolutionstuff.com</h1><br />
            Enter Password <input type="password" class="form-control" id="Password" placeholder="Enter a password" name="password"><br /> <br / >
            Enter Confirm Password <input type="password" class="form-control" id="ConfirmPassword" placeholder="Enter a Confirm Password" name="confpassword" >
            <div style="margin-top: 7px;" id="CheckPasswordMatch"></div>
        </div>
      </div>
  <body>
</html>
<script>
$(document).ready(function () {
   $("#ConfirmPassword").on('keyup', function(){
    var password = $("#Password").val();
    var confirmPassword = $("#ConfirmPassword").val();
    if (password != confirmPassword)
        $("#CheckPasswordMatch").html("Password does not match !").css("color","red");
    else
        $("#CheckPasswordMatch").html("Password match !").css("color","green");
   });
});
</script>

 

 

And you will get output like the below image.

how_to_validate_password_and_confirm_password_using_JQuery.jpg

 


You might also like:

Recommended Post
Featured Post
Laravel 10 AJAX CRUD Operations Example
Laravel 10 AJAX CRUD Operation...

In this article, we will see the laravel 10 ajax crud operations example. Here, we will learn about ajax crud operation...

Read More

Feb-27-2023

Node.js MySQL Insert Record
Node.js MySQL Insert Record

In this tutorial we will see how to insert data into MySQL table using Node.js. In previous node .js article I will give...

Read More

Sep-29-2021

Laravel whereIn and whereNotIn Query Example
Laravel whereIn and whereNotIn...

In this article, we will see the laravel whereIn and whereNotIn query examples. laravel query builder provides many diff...

Read More

Jan-16-2021

Require ext-curl is missing from your system ubuntu
Require ext-curl is missing fr...

In this article, we will see require ext-curl * is missing from your system in ubuntu. When we set up the laravel 9...

Read More

Feb-16-2023