Check for equality in fields

[lurtnowski]

I have a form where I want a user to create a password, then confirm it. I’m trying to make sure the two fields are the same using

<form action="users/add_user_engine.php" method="POST" onsubmit="return validatePassword();" >

on the form, heres the function

<script language="javascript">
var password = document.getElementById("Password"), confirm_password = document.getElementById("Password2");
function validatePassword(){
  if(password.value != confirm_password.value) {
    alert("Passwords Don\'t Match");
	return false;
	} else {
	return true;
	} 
}
</script>

But I get the alert() if the 2 fields match when im just trying to allow the form to submit,

[m_hutley]

Show us the inputs?

[lurtnowski]

here

<form action="users/add_user_engine.php" method="POST" onsubmit="return validatePassword(this);" >
<input type="password" class="form-control" id="Password" name="Password" maxlength="25" required>					
<input type="password" class="form-control" id="Password2" name="Password2" required>

the function

<script language="javascript">
function validatePassword(form){
	var password = form.Password.value, confirm_password = form.Password2.value;
  if(password.value != confirm_password.value) {
    alert("Passwords Don\'t Match");
	return false;
	} else {
	return true;
	} 
}
</script>

[Pepster64]

Personally I never like testing for false conditions, but rather true conditions unless I absolutely have to.

Here’s a example of my registration form on my website (though it needs a little touch-up).

    <div class="password1">
        <label for="passwordBox">Password</label>
        <input class="passwordBox1" id="passwordBox" type="password" name="user[hashed_password]" value=""
               tabindex="6" required>
        <label for="passwordVisibility">Show Passwords (private computer)</label>
        <input class="passwordBtn1" id="passwordVisibility" type="checkbox" tabindex="7">
    </div>

    <div class="password2">
        <label for="redoPassword">ReEnter Password</label>
        <input class="passwordBox2" id="redoPassword" type="password" name="user[redo]" value="" tabindex="8"
               required>
    </div>

The vanilla JavaScript

    let checkPassword1 = document.querySelector('#passwordBox');
    let checkPassword2 = document.querySelector('#redoPassword');

    checkPassword2.addEventListener('input', () => {
        //console.log(checkPassword2.value);
        if (checkPassword2.value === checkPassword1.value) {
            /* Probably would be better to show a text status in an HTML element */
            submitBtn.style.display = "inline-block";
        } else {
            submitBtn.style.display = "none";
        }
    });

[lurtnowski]

thanks