Linwind

Validar formularios fácilmente con jQuery

Crear un formulario con html es bastante sencillo, seguramente lo que más tiempo nos lleve a la mayoría es crear el javascript para comprobar que todos los campos han sido rellanados correctamente.

Gracias al blog de unijimpe me entero de un plugin para jQuery llamado VanadiumJS que nos facilitará mucho esta tarea, para instalarlo en nuestro fichero html lo primero que tendremos que hacer es insertar en la cabecera jQuery con el siguiente código:

  • <script type=«text/javascript» src=«http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js»></script>

Una vez hecho esto descargamos VanadiumJS, lo subiremos por ftp y lo pondremos en la cabecera de la siguiente manera.

  • <script type=«text/javascript» src=«vanadium.js»></script>

Cuando tengamos esto en la cabecera del fichero del formulario, ya podremos validar los formularios de una forma sencilla añadiéndole alguna de las siguiente clases según lo que necesitemos validar en el campo:

  • :required -> obligatorio.
  • :integer solo números enteros.
  • :float números decimales.
  • :length;x tiene que tener x caracteres.
  • :min_length;x mínimo x caracteres.
  • :max_length;n máximo x caracteres.
  • :accept debe ser aceptado.
  • :email comprobar email.

Esta es una pequeña lista de ejemplos en VanadiumJS puedes ver muchos otros, también puedes leer el artículo Vanadium: Validar formularios fácilmente

Publicado el 23 de septiembre, 2009

Script jQuery para validar formularios
Publicado el 17 Feb 2010

Realiza transiciones CSS3 fácilmente con jQuery Transit
Publicado el 19 Nov 2011

Crea CSS para formularios fácilmente.
Publicado el 05 Feb 2009

Validar código HTML y CSS para emails con Fractal
Publicado el 25 Jun 2011

10 Comentarios

  1. carlos dice:

    Hola amigo muy buen aporte jajaja es que es problematico crear las balidaciones para cada uno y es un cpdigo extenso lo voy a probar espero que funcione bien.

  2. walter dice:

    hola amigo por favor pone un ejemplo de valida datos jquery

  3. Kaiser79 dice:

    Walter
    y no querras que lo hagan tambien en tu pagina, esto que es un lugar para que otros hagan nuestro trabajo, bastante se han tomado la molestia de decirnos que nos ayuda como para que alguien mas no pueda leer y ver como funciona, es el colmo de la holgazaneria.

  4. javier dice:

    como puedo validar un campo solo con caracteres alfabeticos…. ya vi todas las reglas pero no encuentro nada para que solamente acepte este tipo de caracteres

  5. Diegofilo dice:

    Mijo para los números es number en lugar de integer.
    De cualquier forma gracias por el dato, me sirvio mucho.

  6. michelle dice:

    lo intento aplicar a mi pagina web
    pero no hay ni un resultado..
    he estado leyendo y resulta que puede ser por que estoy utilizando DIVS … ES ESO REALMENTE? SE PUEDE ARREGLAR¿

    • gonza dice:

      michelle
      Tardo en responder, pero seguro.
      No tienen nada que ver los DIVS, ya que los divs son elementos contenedores de HTML y está bien que los uses.
      El problema es que no te anda porque esto es una validación usando JQUERY y para usar todo lo relacionado a JQuery tenés que tener agregadas las librerias JQuery.

      Explicar acá Qué es JQuery y de que se trata esto de agregar librerias es un tema muy largo, por eso busca info en: http://jquery.com/. O busca en google «tutorial JQuery» que hay muchisimas webs explicativas en español paso a paso.

  7. luison dice:

    no me sale para validar fecha y hora lo hago asi
    ‘fechahoraalta’: {required:true, date:true,time: true },

    ‘fechahoraalta’: { required: ‘ *Debe ingresar hora’,date: ‘Debe ingresar fecha’, time: ‘Debe ingresar hora’ },

    no me hace la validacion como se hace la validacion de fecha y hora

  8. Antonio dice:

    Buenas Tardes!

    Necesit saber como introducir valores mayores a 0 con la Validacion de vanadium en el formulario
    yo tengo lo sigiuiente

    <input name="cantidad" type="text" id="cantidad" value="» size=»8″ class=»:digits «>

    pero necesito que me informe cuando el valor que introduzco sea 0 para que me diga que no es correcto

    Gracias

    Vanadium es bastante util la verdad!!

  9. Hernán dice:

    tengo una duda, estoy haciendo un trabajo y necesito validar un CheckBox, ¿la función «accept» me sirve para validar este? ya que lo intente pero no me funciono.

Dejar un comentario


Actualidad Windows Linux Juegos Redes Sociales Utilidades Telefonía Movil Micropost