Validacion de Formularios con Javascript

Validacion de Formularios con Javascript

El dia de hoy vamos a ver un poco de validacion de formularios con javascript, html e informar al usuario de estos errores, todo del lado del cliente como una primera etapa de seguridad en nuestros proyectos web. La seguridad es un factor importante de ayer, hoy y siempre, por lo que ver y entender este tema es de suma importancia para todos los que nos dedicamos a este mundo del desarrollo, a nadie nos gusta crear sistemas débiles que caen a la primera de cambios y es por esto que hoy damos un pequeño paso para asegurar el funcionamiento deseado de nuestros sistemas, la validacion de formularios con javascript del lado del cliente..

Escenario

Vamos a desarrollar un simple formulario web, si ese con html facil, el cual validara algunas reglas que nosotros queremos que se cumplan o que nuestro sistema requiere, finalmente mostraremos al usuarios cuando no cumpla con alguna de esta regla permitiendo editar tal campo erroneo para posteriormente mandar el formulario a su destino.

Nuestras reglas seran:

  • Todos los campos son obligatorios
  • El campo nip debe de ser de 4 digitos
  • El campo para repetir nip debera ser el mismo que el campo nip anterior
  • El campo email debe ser en realidad un email

Pues adelante, comencemos nuestra validacion de formularios con Javascript!

Validacion de Formularios – Codigo

Aqui tenemos el codigo html

aca el css

y por aca le javascript

 


Suscríbete!

Suscríbete a nuestra lista de correo y recíbe los últimos contenidos directamente en tu bandeja de correo electrónico, puedes elegir únicamente de que categoria del blog quieres recibir contenido.

Suscríbeme

¿Que te pareció? Seguro que lo puedes mejorar.. El siguiente paso es dar seguridad del lado del servidor sobre todo si involucraremos bases de datos.
Hasta luego!

Validacion de Formularios con Javascript

2 Comentarios ¿Qué opinas tú del tema?

  1. Arturo

Dejar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *