jQuery Form Validation Plugin

How to setup

This plugin requires 2 files to work, the jQuery library, and the plugin script:

/** jQuery Inclusion **/
<script type="text/javascript" src="Path_to/jQuery.js"></script>
 
/** Plugin Inclusion **/
<script type="text/javascript" src="Path_to/jquery-validate.js"></script>

As this plugin works with forms, the next step is to create your form markup, and to add the class='required' to every field you want to validate before submit (input,select,textarea...).

<form id="formid" action="" method="POST">
 
  <label for="field1">Compulsory Field 1</label>
  <input id="field1" name="field1" class="required" />
 
  <label for="field2">Compulsory Field 2</label>
  <input id="field2" name="field2" class="required" />
 
  <label for="field3">Compulsory Field 3</label>
  <input id="field3" name="field3" class="required" />  
 
  <input id="valid_submit" name="valid_submit" type="submit" />
</form>

Finally, to set up the validation, you need to add the following code in the header or in a separate js file:

<script type="text/javascript">
  // Plugin use
  $(document).ready(function(){
    $("#formid").validate();
  });
</script>

Please note that the form id must be the same in the html and in the javascript.

S_ADD_BACKEND_VALIDATION

Why not share this here:

You may also like:

Leave a Comment

Posted Comments

No comments have been posted so far. Be the first!

From jdmweb at 19:06 29/07/10 { Reply }