Diferencia entre revisiones de «Usuario:ManuelRomero/JavaScript/jquery/validate/solucionEJ3»
De WikiEducator
< Usuario:ManuelRomero | JavaScript | jquery | validate
| Línea 23: | Línea 23: | ||
<script type="text/javascript" src="jquery-1.8.2.min.js"></script> | <script type="text/javascript" src="jquery-1.8.2.min.js"></script> | ||
<script type="text/javascript" src="jquery.validate.js"></script> | <script type="text/javascript" src="jquery.validate.js"></script> | ||
| + | <script> | ||
| + | $(document).ready(init); | ||
| + | function init(){ | ||
| + | $("#formulario").validate( | ||
| + | { | ||
| + | onkeyup: false, | ||
| + | onfocusout: false, | ||
| + | onclick:false | ||
| + | } | ||
| + | ); | ||
| + | </script> | ||
</head> | </head> | ||
<body> | <body> | ||
| Línea 50: | Línea 61: | ||
</div> | </div> | ||
</form> | </form> | ||
| − | + | ||
| − | + | ||
| − | + | ||
</body> | </body> | ||
</html> | </html> | ||
</source> | </source> | ||
Última revisión de 02:53 15 abr 2016
- Para hacer este ejercicio ten encuenta los siguientes aspectos
- JQuery puede hacer la validación en diferentes instantes
- En resument la puede hacer cuando ocurren los siguientes eventos
onsubmit, onfocusout, onkeyup, onclick
- Por defecto JQuery hace la validación cuando puede
- Si queremos evitar que lo haga lo hemos de explicitar en la inviación al método
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>Untitled Document</title> <!--Estilos para cumplir con enunciado: --> <style> .important{color:red; font-weight:bold;} label{display:inline-block; width:200px;} input[type="submit"]{margin-left:200px;} </style> <!--Cargamos los scripts necesarios para poder hacer las validaciones:--> <!--Los scripts se cargan siempre después de los css, nunca antes!--> <script type="text/javascript" src="jquery-1.8.2.min.js"></script> <script type="text/javascript" src="jquery.validate.js"></script> <script> $(document).ready(init); function init(){ $("#formulario").validate( { onkeyup: false, onfocusout: false, onclick:false } ); </script> </head> <body> <form id="formulario" novalidate action="accion.php" method="post"> <div> <label for="nombre">Nombre: <span class="important">*</span> </label> <input type="text" id="nombre" name="nombre" class="required" minlength="2"/> </div> <div> <label for="email">E-mail: <span class="important">*</span> </label> <input type="email" id="email" name="email" class="required" /> </div> <div> <label for="url">Url:</label> <input type="url" id="url" name="url" class="url"/> </div> <div> <label for="comentarios">Comentarios:</label> <textarea id="comentarios" name="comentarios" class="required"></textarea> </div> <div> <input type="submit" value="Enviar" /> </div> </form> </body> </html>
