CODE EXAMPLE FOR JAVASCRIPT

check passwords match javascript

function checkPasswordsMatch(input1, input2) {
  if (input1.value !== input2.value) {
    console.log('Passwords do not match')
    // showError(input2, 'Passwords do not match')
    //its better practice to create a css class that will show a red border
    //or a css class that will show some text under the input than to call 
    //the class, see below for example and see source for complete project 
  }
}
//all other code is below
//! Show Success Outline
function showSuccess(input) {
  const formControl = input.parentElement;
  formControl.className = 'form-control success';
}

//! Show input Error Message
function showError(input, message) {
  const formControl = input.parentElement;
  formControl.className = 'form-control error';
  const small = formControl.querySelector('small');
  small.innerText = message;
}

//css
.form-control.error small{
  visibility: visible;
}


.form-control small {
  color:var(--error-color);
  position: absolute;
  bottom: 0;
  left: 0;
  visibility: hidden;
}


.form-control.success input{
  border-color: red;
}

//html
<div class="form-control">
          <label for="password">Password</label>
          <input type="password" id="password" placeholder="Enter password" />
          <small>Error message</small>
        </div>
        <div class="form-control">
          <label for="password2">Confirm Password</label>
          <input
            type="password"
            id="password2"
            placeholder="Enter password again"
          />
          <small>Error message</small>
        </div>