client side validation drupal 7

Drupal provides client-side validation by module. If you install this module in your project then in whole project client side validation will work without reloading page.

So all steps are given below, Please follow below steps.

Step 1:

The main module (Clientside Validation) provides the core functionality for Clientside Validation. However, it does nothing by itself, it needs at least one of its submodules to provide any real functionality. The submodules are:

• Clientside Validation FAPI: Provides Clientside Validation for the Form API Validationmodule.
• Clientside Validation Field Validation: Provides Clientside Validation for the Field validationmodule (Drupal 7 only).
• Clientside Validation Form: Provides Clientside Validation for standard Form API elements.
• Clientside Validation HTML5: Provides Clientside Validation for HTML5 elements (seeDrupal HTML5 Initiative, Drupal 7 only).
• Clientside Validation Webform: Provides Clientside Validation for the Webform andWebform Validation module.

 Here you can download all submodule related to this client side validation and download Clientside Validation.

at the time of Installation this module below screen will come.

To configure settings for this module go to admin/config/validation/clientside_validation for Drupal 7 or to admin/settings/clientside_validation for Drupal 6. There are several settings for this module, we will guide you through them.

Step 2: 

Go through this path  "Home » Administration » Configuration »Clientside Validation"

there you can see below picture,

Click on "General settings" and give same setting which is shown below.

After You have to change the "default setting", give same as below or you give as you wish.

 

Error message placement

Default location

Here you can select the default location to display your error messages. You can choose between the following options:

• jQuery selector: This option will place a div containing all the error messages inside the div that matches the jQuery selector entered in the "jQuery selector" field below this option.
• Top of form: This option will place a div containing all the error messages above the form the error messages are for.
• Before label: This option will place the error before the label of the matching element
• After label: This option will place the error after the label of the matching element
• Before input: This option will place the error before the matching element
• After input: This option will place the error after the matching element
• Top of first form: This option will place a div containing all the error messages above the first form. This means that when there are multiple forms on a page, the errors of the second form will be added to the error div of the first form and will be displayed above the first form
• Custom function: (Advanced) Selecting this option requires you to enter a javascript function name in the textfield "Custom function name" below this option. This function name will be given to the errorPlacement option of jQuery.validate()
•  

Error placement exceptions

For each of the previously mentioned options you can enter form ids (one per line) in the textareas of the "Error placement exceptions" fieldset. Errors for the form matching this form id will appear according to the textarea you entered its form id in. For example if you enter page_node_form in the "Before label" textarea of the "Error placement exceptions" fieldset, all error messages for this form will be displayed before the label of the field they are for, regardless of what the default setting is.

After set all configuration you can check on any form, client side validation will work.





If you are using Drupal 6 then you have install some other sub module for clientside validation which is listed below 
download all submodule then install it.
Drupal 6 submodule for client side validation

clientside_validation
context
elements
fapi_validation
features
field_permissions-7.x-1.0-

beta2
field_validation
ife
testswarm
webform
webform_validation

Enjoy guys, if any issue you can comment here.