Question

I’m making a registration form and I want to check if the user has matching passwords while he’s typing and give him the appropriate message. So far everything works, except for these things:

• When the user deletes everything from Confirm Password field it still
  gives him a message “Passwords do not match” while I want to give him
  no message or a message saying “Please confirm password”.
• When the
  user deletes everything from both fields, it gives him a message
  “Passwords match”, while it should give him no message at all.

Here’s my code:

$(function () {
   $("#txtNewPassword").keyup(checkPasswordMatch);
   $("#txtConfirmPassword").keyup(checkPasswordMatch);
});


function checkPasswordMatch() {
    $("#divCheckPasswordMatch").html("");
    var password = $("#txtNewPassword").val();
    var confirmPassword = $("#txtConfirmPassword").val();

    if (password == "" && confirmPassword == ""){
        $("#divCheckPasswordMatch").html("");
        $("#divIsPasswordExist").html("");
    }
    else if (password != "" && confirmPassword == "") {
        $("#divCheckPasswordMatch").html("");
    }

    else if (password == "" && confirmPassword != "")
        $("#divIsPasswordExist").html("Password cannot be empty!");
    else
        $("#divIsPasswordExist").html("");


    if (password != confirmPassword)
    {
        $("#divCheckPasswordMatch").removeClass("registrationFormConfirm");
        $("#divCheckPasswordMatch").addClass("registrationFormAlert");
        $("#divCheckPasswordMatch").html("Passwords do not match!");
    }
    else
    {
        $("#divCheckPasswordMatch").removeClass("registrationFormAlert");
        $("#divCheckPasswordMatch").addClass("registrationFormConfirm");
        $("#divCheckPasswordMatch").html("Passwords match.");
    }
}

Any ideas, please?
Thank you!

Answer 1

......
        if (password == "" && confirmPassword == ""){
            $("#divCheckPasswordMatch").html("");
            $("#divIsPasswordExist").html("Password and Confirm Password dosen't exists");
            return;
        }
        else if (password != "" && confirmPassword == "") {
            $("#divCheckPasswordMatch").html("Confirm Password dosent't exists");
            return;
        }
        else if (password == "" && confirmPassword != ""){
            $("#divIsPasswordExist").html("Password cannot be empty!");
            return;
        }
        else{
            $("#divIsPasswordExist").html("");
        }
        if (password != confirmPassword)
        {
            $("#divCheckPasswordMatch").removeClass("registrationFormConfirm");
            $("#divCheckPasswordMatch").addClass("registrationFormAlert");
            $("#divCheckPasswordMatch").html("Passwords do not match!");
        }
        else
        {
            $("#divCheckPasswordMatch").removeClass("registrationFormAlert");
            $("#divCheckPasswordMatch").addClass("registrationFormConfirm");
            $("#divCheckPasswordMatch").html("Passwords match.");
        }
.........