Monday, 18 August 2014

Form Validation Using JavaScript

Posted by D. arunkumar  |  No comments

This Is a Sample Form:

Simple Registration Form
Type:
Name:
Email:
Password:
Re-Type Password:



HTML CODE:

        
  
         
        
 <form name="reg" id="reg" method="post" onSubmit="return validate_reg();" action="" >  
                                      <table border="1" cellspacing="0" cellpadding="0">  
                                       <tr>  
                                        <td align="left" valign="middle"><b>Simple Registration Form</b></td>  
                                        </tr>  
                                       <tr>  
                                        <td align="left" valign="middle">Type:  
                                         <select name="type">  
                          <option value="Select">Select Type</option>  
                                          <option value="1">IT - software</option>  
                                          <option value="2">NON-IT software</option>  
                                          </select>                                        </td>  
                                        </tr>  
                                       <tr>  
                                        <td align="left" valign="middle">Name: <input type="text" name="name" placeholder="Name" >                                        </td>  
                                        </tr>  
                                       <tr>  
                                        <td align="left" valign="middle">Email:<input type="text" name="email" placeholder="Email" ></td>  
                                        </tr>  
                                       <tr>  
                                        <td align="left" valign="middle">Password:<input type="password" name="pwd" placeholder="Password" ></td>  
                                        </tr>  
                                       <tr>  
                                        <td align="left" valign="middle">Re-Type Password:<input type="password" name="cpwd" placeholder="Re Enter Password" ><br />  
                                         <label for="remember">  
                                          <input type="checkbox" name="terms" id="remember" value="remember" />  
                                          <span>I accept to the <a href="" target="_blank" style="color:maroon;">Terms and Conditions</a></span>                                         </label><br /><br />  
                           <div style="text-align:center;"><input type="submit" name="submit" title="Submit" class="rbutton" value="Submit" /></div>                          </td>  
                                        </tr>  
  </table>  
                                      </form>  
Here Is JAVASCRIPT CODE:
  
         
        
                                 <script language="javascript">   
                                                    function validate_reg()  
                                                    {   
                                                    if(document.reg.name.value == '')  
                                                    {  
                                                     alert("Name filed is required");  
                                                        document.reg.name.focus();  
                                                        return false;  
                                                    }  
                                                    var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;  
                                                    var address = document.reg.email.value;  
                                                          if(reg.test(address) == false) {  
                                                              alert('Invalid Email');  
                                                              document.reg.email.focus();  
                                                              return false;  
                                                              }  
                                                   if(document.reg.pwd.value == '')  
                                                    {  
                                                     alert("Password filed is required");  
                                                        document.reg.pwd.focus();  
                                                        return false;  
                                                    }       
                                                    if(document.reg.cpwd.value == '')  
                                                    {  
                                                     alert("Re Enter Password filed is required");  
                                                        document.reg.cpwd.focus();  
                                                        return false;  
                                                    }            
                                                    if(document.reg.pwd.value != document.reg.cpwd.value)  
                                                    {  
                                                     alert("Passwords doesn't matched");  
                                                        document.reg.cpwd.focus();  
                                                        return false;  
                                                    }  
                                                    if(document.reg.terms.checked == false)  
                                                    {  
                                                         alert("You have to agree with the Terms & Conditions.");  
                                                        return false;       
                                                    }  
                                               }  
                                                   </script>  

10:10 Share:

0 comments:

Get updates in your email box
Complete the form below, and we'll send you the best coupons.

Deliver via FeedBurner
Proudly Powered by Blogger.
back to top