Después de un paro ‘blogero’, básicamente por disponer de poco tiempo, como es habitual, volvemos a la carga.

Hoy voy a intentar explicar un poco, como crearnos nuestro formulario con un validador hecho con jquery. Vale la pena disponer de un validador, así solo nos basta de referenciarlo en el documento y no repetir   el mismo código infitas veces.

Vamos al lio.

Lo primero de todo, será crear el formulario:

Una vez tengamos el formulario creado,  si pulsamos el botón de enviar, podremos enviarlo sin pasar ningún tipo de revisión, con lo cual, podríamos enviar el formulario vacio sin problema alguno.
Para intentar evitar la entrada de campos vacios empezaremos insertando en los campos que queramos validar, la clase ‘validacion’.

Para que nos sirve insertar una clase en el campo? Pues muy sencillo, será como una marca que tiene el campo, que en javascript nos facilitara su búsqueda.

Antes de crear el javacript, vamos a crear la clase css que nos mostrara el aviso.
.focus{
border: 1px solid red;
}

Vamos a crear el javascript:

Como vamos a usar jquery, te recuerdo que deberás insertar el fichero jquery en el código. Para mas info de jquery.

Con esto ya lo tendríamos echo, aun así, es necesario que dentro del código php que se encargará de procesar los campos, que se validen de nuevo los campos y sobretodo, que se procesen los campos para evitar sql injections(en el caso que trabajemos con bd) o contra ataques en el servidor.

NOTA:
El ejemplo explicado es muy sencillo de utilizar. Podríamos complicarlo, por ejemplo, insertando un texto debajo de cada campo que no este lleno mostrando al usuario que el campo se debe rellenar. Tan solo deberíamos crear un campo oculto debajo de cada input con el nombre del campo _error y mostrarlo con el jquery. Ejemplo:
html

css:

js: