jQuery validation

You’re probably looking for

If not, read on.

Throughout the documentation, two terms are used very often, so it’s important that you know their meaning in the context of the validation plugin:

  • method: A validation method implements the logic to validate an element, like an email method that checks for the right format of a text input’s value. A set of standard methods is available, and it is easy to write your own.
  • rule: A validation rule associates an element with a validation method, like “validate input with name “primary-mail” with methods “required” and “email”.

This library adds three jQuery plugin methods, the main entry point being the validate method:

This library also extends jQuery with three custom selectors:

The validate method returns a Validator object that has a few public methods that you can use to trigger validation programmatically or change the contents of the form. The validator object has more methods, but only those documented here are intended for usage.

There are a few static methods on the validator object:

A set of standard validation methods is provided:

Some more methods are provided as add-ons, and are currently included in additional-methods.js in the download package. Not all of them are documented here:

You can find the source code for all additional methods in the GitHub repository.

General Guidelines

The General Guidelines section provides detailed discussion of the design and ideas behind the plugin, explaining why certain things are as they are. It covers the features in more detail than the API documentation, which just briefly explains the various methods and options available.

If you’ve decided to use the validation plugin in your application and want to get to know it better, it is recommended that you read the guidelines.

When you have a name attribute like user[name], make sure to put the name in quotes. More details in the General Guidelines.

Another common problem occurs with this code:

1
2
3
4
5
6
7
8
$("#myform").validate({
submitHandler: function(form) {
// some other code
// maybe disabling submit button
// then:
$(form).submit();
}
});

This results in a too-much-recursion error: $(form).submit() triggers another round of validation, resulting in another call to submitHandler, and voila, recursion. Replace that with form.submit(), which triggers the native submit event instead and not the validation.

So the correct code looks slightly different:

1
2
3
4
5
$("#myform").validate({
submitHandler: function(form) {
form.submit();
}
});

Leave a Comment

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据