Tengo un formulario con campos para contraseña y confirmar contraseña y otros campos de entrada. Creé una función que llama a otras funciones. Básicamente, esta función llama a una función que muestra un mensaje de confirmación antes de enviar mi formulario, y la otra función es una validación para que los dos campos de contraseña sean iguales.
Entonces, la función que muestra el mensaje de confirmación funciona, pero la validación de contraseñas no.
function confirmarAlta(){ var result = confirm("Esta seguro que desea crear este usuario?"); if(result == false){ event.preventDefault(); } } function verificarPassword(){ var pass = document.querySelector(".password").value; var confirmPass = confirmPassword.querySelector(".confirmPassword").value; console.log(pass); console.log(confirmPass) if(pass != confirmPass){ alert("Las contraseñas no coinciden"); pass = ""; confirmPass = ""; } } function Validaciones(){ verificarPassword(); confirmarAlta(); } <div class="form-group"> <label>Contraseña: </label> <input type="password" class="form-control password" name="txtPassword" required> </div> <div class="form-group"> <label>Repetir Contraseña: </label> <input type="password" class="form-control confirmPassword" name="txtConfirmarPassword" required> </div> <input onclick="Validaciones()" type="submit" class="btn btn-success" value="Aceptar" name="btnAceptar">El error que recibo es confirmPassword no está definido.
Cuando está seleccionando la entrada de confirmación de contraseña, está seleccionando desde confirmPassword en lugar de document .
Haz este cambio:
// Current confirmPassword.querySelector(".confirmPassword").value // Change by document.querySelector(".confirmPassword").value function confirmarAlta(){ var result = confirm("Esta seguro que desea crear este usuario?"); if(result == false){ event.preventDefault(); } } function verificarPassword(){ var pass = document.querySelector(".password").value; var confirmPass = document.querySelector(".confirmPassword").value; console.log(pass); console.log(confirmPass) if(pass != confirmPass){ alert("Las contraseñas no coinciden"); pass = ""; confirmPass = ""; } } function Validaciones(){ verificarPassword(); confirmarAlta(); } <div class="form-group"> <label>Contraseña: </label> <input type="password" class="form-control password" name="txtPassword" required> </div> <div class="form-group"> <label>Repetir Contraseña: </label> <input type="password" class="form-control confirmPassword" name="txtConfirmarPassword" required> </div> <input onclick="Validaciones()" type="submit" class="btn btn-success" value="Aceptar" name="btnAceptar">Parece que falta un punto y coma al final de la línea...
console.log(confirmPass)Además, ¿la intención de que la confirmación de la contraseña no borre los cuadros de entrada para el usuario? ¿O solo esas variables locales? Puede obtener la referencia del objeto en lugar del valor en esas variables y luego restablecer el valor si eso es lo que desea.
Nada más me llama la atención, pero sí... definitivamente aprende a usar las herramientas de desarrollo integradas en el navegador (por lo general, puedes acceder presionando la tecla 'F12'). Puede establecer puntos de interrupción en el javascript y recorrer la ejecución del código para ver dónde están ocurriendo los errores.