A simple jQuery Form Validation

Here I am creating a simple jQuery form validation consist of a user form, custom js file, jQuery.js and jQuery-validation.js.

Both jQuery js & jQuery-validation.js file you can download from the below jQuery site and I would highly recommend to go through the API-documentation if you have time.

jQuery Validation JS --- jQuery Validation API Documentation
Download jQuery --- jQuery API Documentation

First, we will create a simple form with labels and input tabs.

It is not required to have labels, but a good practice suggests that we should use label with our inputs.
I used both in the below code just to explain validation works irrespective of labels(I got this question many times, so thought of trying that).

Second, we need a js file (you can add the js code inside html or jsp file too inside the "Script" tag.I added a separate js because I follow that pattern.)
In your js file add the below code to validate the form input fields.
Make sure you added jQuery.js and jQuery-validation.js else the below code will not work and you will get error in your web dev tool console.

As I told you earlier, I am creating a simple jQuery validation form. So, here I am only implementing rules, different messages and what action to perform after successful validation.

Thats all you need to do and form is ready to validate via jQuery validation framework.

Note:

Don't forget to add jQuery.js and jQuery-validation.js in you project.