JavaScirpt Tutorial Index

JavaScript Tutorial Javascript Example Javascript comment Javascript Variable Javascript Data Types Javascript Operators Javascript If Else Javascript Switch Statement Javascript loop JavaScript Function Javascript Object JavaScript Arrays Javascript String Javascript Date Javascript Math Javascript Number Javascript Dialog Box Javascript Window Object Javascript Document Object Javascript Event Javascript Cookies Javascript getElementByID Javascript Forms Validation Javascript Email Validation Javascript Password Validation Javascript Re-Password Validation Javascript Page Redirect Javascript Print

Misc

JavaScript P5.js JavaScript Minify JavaScript redirect URL with parameters Javascript Redirect Button JavaScript Ternary Operator JavaScript radio button checked value JavaScript moment date difference Javascript input maxlength JavaScript focus on input Javascript Find Object In Array JavaScript dropdown onchange JavaScript Console log Multiple variables JavaScript Time Picker Demo JavaScript Image resize before upload Functional Programming in JavaScript JavaScript SetTimeout() JavaScript SetInterval() Callback and Callback Hell in JavaScript Array to String in JavaScript Synchronous and Asynchronous in JavaScript Compare two Arrays in JavaScript Encapsulation in JavaScript File Type Validation while Uploading Using JavaScript or jquery Convert ASCII Code to Character in JavaScript Count Character in string in JavaScript Get First Element of Array in JavaScript How to convert array to set in JavaScript How to get current date and time in JavaScript How to Remove Special Characters from a String in JavaScript Number Validation in JavaScript Remove Substring from String in JavaScript

Interview Questions

JavaScript Interview Questions

Javascript Forms Validation

JavaScript Forms Validation

Form validation works at server, after client had entered all the necessary details and then pressed submit button. JavaScript provides the facility to validate the form on the client side so processing will fasterthan server-side validation. So most of developer prefer client side form validation using JavaScript.

Example

<!DOCTYPE html>  
<html>  
<head>  
<script>  
functionform_validation(){    
var name=document.myform.name.value;    
//var x = document.forms["myform"]["name"].value;  
if (name==null || name==""){    
alert("Name can't be blank");    
return false;    
}    
}  
</script>  
</head>  
<body>  
<form name="myform" method="post" action="register.php" onsubmit="return form_validation()" >  
Name: <input type="text" name="name">  
<input type="submit" value="submit">  
</form>  
</body>  
</html>
Try Now

Another Example of Form validation

<!DOCTYPE html>  
<html>  
<body>  
<form action="/cgi-bin/test.cgi" name="myForm" onsubmit="return(validate());">  
<table cellspacing="2" cellpadding="2" border="1">  
           <tr>  
               <td align="right">Name</td>  
               <td><input type="text" name="Name" /></td>  
           </tr>  
           <tr>  
               <td align="right">Mail id</td>  
               <td><input type="text" name="Mail id" /></td>  
           </tr>       
           <tr>  
               <td align="right">Zip Code</td>  
               <td><input type="text" name="Zip" /></td>  
           </tr>  
           <tr>  
               <td align="right">City</td>  
               <td>  
                  <select name="City">  
                     <option value="-1" selected></option>  
                     <option value="1">New Delhi</option>  
                     <option value="2">Noida</option>  
                     <option value="3">Ghaziabad</option>  
                     <option value="4">Allahabad</option>  
                     <option value="5">Lucknow</option>  
                     <option value="6">Agra</option>  
                     <option value="7">Kanpur</option>  
                     <option value="8">Gurugram</option>  
                     <option value="9">Meerut</option>  
                  </select>  
               </td>  
           </tr>  
           <tr>  
               <td align="right">State</td>  
               <td>  
                  <select name="State">  
                     <option value="-1" selected></option>  
                     <option value="1">Uttar Pradesh</option>  
                     <option value="2">Madhya Pradesh</option>  
                     <option value="3">Bihar</option>  
                     <option value="4">Assam</option>  
                      <option value="5">Uttrakhand</option>  
                     <option value="6">Jharkhand</option>  
                     <option value="7">Gujrat</option>  
                     <option value="8">Haryana</option>  
                     <option value="9">Punjab</option>  
                  </select>  
               </td>  
           </tr>  
           <tr>  
               <td align="right">Country</td>  
               <td>  
                 <select name="Country">  
                     <option value="-1" selected></option>  
                     <option value="1">USA</option>  
                     <option value="2">UK</option>  
                     <option value="3">INDIA</option>  
                   <option value="2">FRANCE</option>  
                     <option value="2">CHINA</option>  
                     <option value="2">JAPAN</option>  
                     <option value="2">RUSSIA</option>  
                  </select>  
               </td>  
           </tr>              
           <tr>  
               <td align="right"></td>  
               <td><input type="submit" value="Submit" /></td>  
           </tr>              
         </table>  
      </form>        
   </body>  
</html>
Try Now