form validation with password and conform_password using sweetalert

 

 <form action="" onsubmit="return checkPassword(this)">
                         
                                <div class="form-group row">
                                    <label for="inputPassword3" class="col-sm-2 col-form-label">Password</label>
                                    <div class="col-sm-10">
                                    <input type="password" name="password"  class="form-control" id="pswd1" >
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="inputPassword3" class="col-sm-2 col-form-label">Confirm Password</label>
                                    <div class="col-sm-10">
                                        <input type="password" name="confirm_password" class="form-control" id="pswd2" >
                                    </div>
                                    </div>
                           




<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script>

    // Function to check Whether both passwords
    // is same or not.
    function checkPassword(form) {
        password1 = form.password.value;
        password2 = form.confirm_password.value;

        // If password not entered
        if (password1 == ''){
            Swal.fire({
                        icon: 'error',
                        title: 'Oops...',
                        text: 'Enter Your Password!',
                        });
            return false

        }

        // If confirm password not entered
        else if (password2 == ''){
            Swal.fire({
                        icon: 'error',
                        title: 'Oops...',
                        text: 'Enter Confirmation Password!',
                        });
            return false

        }

        // If Not same return False.
        else if (password1 != password2) {
            Swal.fire({
                        icon: 'error',
                        title: 'Oops...',
                        text: 'Password Missmatch Please Try again',
                        });
            return false;
        }

        // If same return True.
        else{


           return true;
        }
    }
</script>





Post a Comment

أحدث أقدم