Ya hemos visto recursos para validar formularios, hoy vamos a ver como hacer lo mismo con un plugin jQuery .
Ketchup es un plugin jQuery para validar formularios con el que sólo se requieren 3 simple pasos.
Paso 1
Enlazar los archivos JS de jQuery y del plugin además de la CSS con los estilos:
<link rel="stylesheet" type="text/css" media="screen" href="css/jquery.ketchup.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.ketchup.js"></script>
<script type="text/javascript" src="js/jquery.ketchup.messages.js"></script>
<script type="text/javascript" src="js/jquery.ketchup.validations.basic.js"></script>
Paso 2
Crear un formulario HTML con algunas clases especiales para validación:
<form action="" method="post" id="signup"> <label>Username</label><br/> <input type="text" name="username"/><br/> <label>Password</label><br/> <input type="password" id="password" name="password"/><br/> <label>Retype password</label><br/> <input type="password" type="text" name="passwordconf"/><br/> <label>Email</label><br/> <input type="text" name="email"/><br/> <input type="submit" value="Sign Up"/> </form>
Paso 3
Por último algo de Javascript:
$(document).ready(function() {
$('#signup').ketchup();
});