jQuery Form Validation

This article will guide you to create an HTML form and validate it using jQuery.
This is simple illustration of how we can use jQuery to validate an HTML form.

This is a simple form validation srcipt using jQuery.
 
 To run this script you need to include two js files,
 
 1. jQuery js file 
   a. Compressed
 
    
I am assuming that you have downloaded above files and they are accessed from your html page,
 
Now we will start writing some code, lets start with html.
First create an HTML page with all HTML tags in it and under body section copy below code(Or make your own form),
 
  <form name="contact-us" id="contact-us" method="post">
     <input type="text" name="cfname" id="cfname">
     <input type="text" name="cfemail" id="cfemail">
     <input type="submit" name="cfsubmit" id="cfsubmit">
  </form>
 
Now write below code into your head section,
 
       $(document).ready(function(){
            $("#contact-us").validate({
                rules: {
                           cfname:"required",
                           cfemail:{required:true,email:true}
                         },
                messages : {
                          cfname: "Please enter your name.",
                          cfemail:{required:"Please enter your e-mail address.",email:"Please enter valid e-mail address."}
                         }
                      });
             });
 
Dont forget to write above script in opening and closing <script> tags.
 
I hope this is worked for you. 
If you are having any questions about this please write them in comments below.
 
Thanks...
Author
No comments available.