logo

Validación de formularios JavaScript

  1. Validación de formulario JavaScript
  2. Ejemplo de validación de JavaScript
  3. Validación de correo electrónico de JavaScript

Es importante validar el formulario enviado por el usuario porque puede tener valores inapropiados. Por lo tanto, la validación es imprescindible para autenticar al usuario.

JavaScript proporciona la posibilidad de validar el formulario en el lado del cliente, por lo que el procesamiento de datos será más rápido que la validación del lado del servidor. La mayoría de los desarrolladores web prefieren la validación de formularios JavaScript.

A través de JavaScript podemos validar nombre, contraseña, correo electrónico, fecha, números de móvil y más campos.


Ejemplo de validación de formulario JavaScript

En este ejemplo, vamos a validar el nombre y la contraseña. El nombre no puede estar vacío y la contraseña no puede tener menos de 6 caracteres.

Aquí, estamos validando el formulario al enviarlo. El usuario no será redireccionado a la página siguiente hasta que los valores proporcionados sean correctos.

tutorial de lenguaje de programación java
 function validateform(){ var name=document.myform.name.value; var password=document.myform.password.value; if (name==null || name==&apos;&apos;){ alert(&apos;Name can&apos;t be blank&apos;); return false; }else if(password.length<6){ 6 alert('password must be at least characters long.'); return false; } name: <br> Password: <br> </6){>
Pruébalo ahora

Validación de contraseña para volver a escribir JavaScript

 function matchpass(){ var firstpassword=document.f1.password.value; var secondpassword=document.f1.password2.value; if(firstpassword==secondpassword){ return true; } else{ alert(&apos;password must be same!&apos;); return false; } } Password: <br> Re-enter Password: <br> 
Pruébalo ahora

Validación de números de JavaScript

Validemos el campo de texto solo para valores numéricos. Aquí, estamos usando la función isNaN().

 function validate(){ var num=document.myform.num.value; if (isNaN(num)){ document.getElementById(&apos;numloc&apos;).innerHTML=&apos;Enter Numeric value only&apos;; return false; }else{ return true; } } Number: <span id="numloc"></span> <br> 
Pruébalo ahora

Validación de JavaScript con imagen.

Veamos un ejemplo de validación de formulario JavaScript interactivo que muestra una imagen correcta e incorrecta si la entrada es correcta o incorrecta.

 function validate(){ var name=document.f1.name.value; var password=document.f1.password.value; var status=false; if(name.length<1){ document.getelementbyid('nameloc').innerhtml="  Please enter your name" ; status="false;" }else{ } if(password.length<6){ document.getelementbyid('passwordloc').innerhtml="  Password must be at least 6 char long" return status; <table class="table"> <tr><td>Enter Name:</td><td> <span id="nameloc"></span></td></tr> <tr><td>Enter Password:</td><td> <span id="passwordloc"></span></td></tr> <tr><td></td></tr>  </1){>
Pruébalo ahora

Producción:

Ingrese su nombre:
Introducir la contraseña:

Validación de correo electrónico de JavaScript

Podemos validar el correo electrónico con la ayuda de JavaScript.

Hay muchos criterios que se deben seguir para validar la identificación del correo electrónico, como por ejemplo:

  • La identificación del correo electrónico debe contener @ y . personaje
  • Debe haber al menos un carácter antes y después de @.
  • Debe haber al menos dos caracteres después. (punto).

Veamos el ejemplo sencillo para validar el campo de correo electrónico.

 function validateemail() { var x=document.myform.email.value; var atposition=x.indexOf(&apos;@&apos;); var dotposition=x.lastIndexOf(&apos;.&apos;); if (atposition<1 || dotposition="x.length){" alert('please enter a valid e-mail address 
 atpostion:'+atposition+'
 dotposition:'+dotposition); return false; } email: <br> </1>
Pruébalo ahora