logo

Validació del formulari JavaScript

  1. Validació del formulari JavaScript
  2. Exemple de validació de JavaScript
  3. Validació de correu electrònic de JavaScript

És important validar el formulari enviat per l'usuari perquè pot tenir valors inadequats. Per tant, la validació és necessària per autenticar l'usuari.

JavaScript ofereix la possibilitat de validar el formulari al costat del client, de manera que el processament de dades serà més ràpid que la validació del costat del servidor. La majoria dels desenvolupadors web prefereixen la validació de formularis JavaScript.

Mitjançant JavaScript, podem validar nom, contrasenya, correu electrònic, data, números de mòbil i més camps.

verificació nul de java

Exemple de validació de formulari JavaScript

En aquest exemple, validarem el nom i la contrasenya. El nom no pot estar buit i la contrasenya no pot tenir menys de 6 caràcters.

Aquí, estem validant el formulari a l'enviament del formulari. L'usuari no es reenviarà a la pàgina següent fins que els valors donats siguin correctes.

 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){>
Prova-ho ara

Validació de contrasenya per tornar a escriure 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> 
Prova-ho ara

Validació de números de JavaScript

Validem el camp de text només per al valor numèric. Aquí, estem utilitzant la funció 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> 
Prova-ho ara

Validació de JavaScript amb imatge

Vegem un exemple de validació de formulari JavaScript interactiu que mostra la imatge correcta i incorrecta si l'entrada és 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){>
Prova-ho ara

Sortida:

Introduïu el nom:
Introduir la contrasenya:

Validació de correu electrònic de JavaScript

Podem validar el correu electrònic amb l'ajuda de JavaScript.

Hi ha molts criteris que s'han de seguir per validar l'identificador de correu electrònic, com ara:

  • L'identificador de correu electrònic ha de contenir @ i . personatge
  • Hi ha d'haver almenys un caràcter abans i després de la @.
  • Hi ha d'haver com a mínim dos caràcters després de . (punt).

Vegem un exemple senzill per validar el camp de correu electrònic.

 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>
Prova-ho ara