I had my access to the controlled system from PHP
, then I reflected and saw that it is not necessary to go to the server so that you can return a message, such as "fill in both fields", for example. So I opted to implement the library of jqueryvalidation, which works well, but once the form I want is validated, and I want to send something again, it does not validate even if the fields are empty, and what is valid is my file PHP
know what is the reason ?, here the code.
HTML
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="estilos/estiloLogin.css"/>
<meta charset="utf-8">
</head>
<body>
<div id="popup">
<div id="formulario">
<h1 id="header" align="center">Ingresar</h1>
<br>
<hr>
<br>
<form action="Controlador/login.php" method="POST" id="formLogin">
<table>
<tr>
<td>Usuario:</td>
<td><input type="text" name="usuario" id="usuario"></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" name="pass" id="pass"></td>
</tr>
<tr>
<td> </td>
<td><input id="botonIngresar" type="submit"></td>
</tr>
<tr>
<td colspan="2" align="right"><a id="linkRegistrarse">¡Registrate!</a></td>
</tr>
</table>
</form>
</div>
</div>
<script src="js/jquery-3.2.1.min.js"></script> <!--Utilizar libreria JQUERY-->
<script src="js/jquery.validate.min.js"></script><!--Lo utilizamos para validar campos-->
<script src="js/codigologin.js"></script> <!--TODO lo que utilize JQUERY deberá ser referenciado despues de la libreria.-->
</body>
</html>
And here is where I validated in my file JS
.
$(document).ready(function() {
$('#formLogin').validate({
rules: {
usuario: { required: true},
pass: { required: true}
},
messages: {
usuario: "Debe ingresar un nombre de usuario.",
pass: "Ingrese una contraseña."
},
submitHandler: function(form){
//REGISTRAR UN NUEVO USUARIO EN NUESTRA BASE DE DATOS MEDIANTE PETICION AJAX
//EFECTUAR INGRESO AL SISTEMA MEDIANTE PETICION AJAX
$('#botonIngresar').click(function(event) {
event.preventDefault();
usuario = $('#usuario').val();
password = $('#pass').val();
var rangoUsuario;
$.ajax({
url: 'Controlador/login.php',
type: 'POST',
dataType: 'JSON',
data: {usuario, password},
beforeSend:function(){
console.log("Se esta procesando tu peticion");
}
})
.done(function(data) {
console.log("success");
$.each(data, function(index, val) {
if (val.estadoCuenta == 'ok') {
if (val.rango == 'Administrador') {
document.location.href = "admin.php"
}else if(val.rango == 'Viper' || val.rango == 'starter'){
document.location.href = "index.php"
}else if(val == 'No existen usuarios registrados con esos datos'){
alert(val);
}else if(val == 'Por favor rellena ambos campos'){
alert(val);
}
}else{
alert(val);
}
});
})
.fail(function() {
console.log("error");
})
.always(function() {
console.log("complete");
},'json');
});
}
});
});
Also I have a question, is there a way to change the messages of "stock", that this library provides you, to make them more colorful?