Home
My Quiz

Password and Confirm Password Check Code Using Java

Publish: 22 February 2024, 5:51 pm IST | Views: Page View 161

<!DOCTYPE html>
<html>
<head>
    <title>Address Details</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="script.js"></script>
    <style>
        .password-match {
            border: 1px solid green;
        }
        .password-not-match {
            border: 1px solid red;
        }
    </style>
</head>
<body>
    <form action="form2_register.php" method="post" id="registrationForm">
        <input type="text" name="name" placeholder="Name" required><br>
        <input type="text" name="mobile" placeholder="Mobile" required><br>
        <input type="password" name="password" id="password" placeholder="Password" required><br>
        <input type="password" name="confirm_password" id="confirmPassword" placeholder="Confirm Password" required><br>
        <input type="text" name="pass_code" placeholder="Pass Code (4 digits)" maxlength="4" required><br>
        
        <input type="submit" value="Register">
    </form>

    <script>
        $(document).ready(function() {
        // Password Match Validation
        $('#confirmPassword').on('keyup', function () {
            let password = $('#password').val();
            let confirmPassword = $('#confirmPassword').val();
            let passwordField = $('#password');
            let confirmPasswordField = $('#confirmPassword');
    
            if (password === confirmPassword) {
                confirmPasswordField.removeClass('password-not-match').addClass('password-match');
            } else {
                confirmPasswordField.removeClass('password-match').addClass('password-not-match');
            }
        });
    });
    </script>
    
</body>
</html>

Categories: Uncategorized