Diferencia entre revisiones de «Usuario:ManuelRomero/JavaScript/jquery/validate/solucionEJ2»

De WikiEducator
Saltar a: navegación, buscar
(Página creada con «Realiza el ejercicio teniendo en cuenta las siguientes acciones # Los scripts se colocarán siempre más tarde que las hojas de estilos. # Se debe cargar primero el de jQu...»)
 
 
(Una revisión intermedia por el mismo usuario no mostrado)
Línea 1: Línea 1:
 +
[[Usuario:ManuelRomero/JavaScript/jquery/validate|<font size=5 color=red>VOLVER</font>]]
 +
 
Realiza el ejercicio teniendo en cuenta las siguientes acciones
 
Realiza el ejercicio teniendo en cuenta las siguientes acciones
 
# Los scripts se colocarán siempre más tarde que las hojas de estilos.  
 
# Los scripts se colocarán siempre más tarde que las hojas de estilos.  

Última revisión de 01:06 15 abr 2016

VOLVER

Realiza el ejercicio teniendo en cuenta las siguientes acciones

  1. Los scripts se colocarán siempre más tarde que las hojas de estilos.
  2. Se debe cargar primero el de jQuery y luego el del plugin de jQuery. Siempre en ese orden.
  3. La llamada al método validate() se puede hacer en el document ready, pero también poniéndolo al final del body (el plugin debe estar cargado previamente, eso sí).
El plugin utiliza el atributo name, es importante ponerlo en cada elemento del formulario. 
<!doctype html>
<html>
 
<head>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
    <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:-->
    <script type="text/javascript" src="jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="jquery.validate.js"></script>
    <script>
        $(document).ready(function() {
            $("#formulario").validate();
        });
    </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="email 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>
    <!--
    <script>
        $("#formulario").validate();
    </script>
    -->
</body>
 
</html>
Obtenido de «https://es.wikieducator.org/index.php?title=Usuario:ManuelRomero/JavaScript/jquery/validate/solucionEJ2&oldid=19347»