Repository files navigation

The jQuery Validation Plugin provides drop-in validation for your existing forms, while making all kinds of customizations to fit your application really easy.

Prebuilt files can be downloaded fromhttps://jqueryvalidation.org/

The unreleased development files can be obtained by:

1. Downloading or Forking this repository
2. Setup the build
3. Rungrunt to create the built files in the "dist" directory

Include jQuery and the plugin on a page. Then select a form to validate and call thevalidate method.

<form><inputrequired></form><scriptsrc="jquery.js"></script><scriptsrc="jquery.validate.js"></script><script>$("form").validate();</script>

Alternatively include jQuery and the plugin via requirejs in your module.

define(["jquery","jquery.validate"],function($){$("form").validate();});

For more information on how to setup a rules and customizations,check the documentation.

See theContributing Guidelines for details.

IMPORTANT NOTE ABOUT EMAIL VALIDATION. As of version 1.12.0 this plugin is using the same regular expression that theHTML5 specification suggests for browsers to use. We will follow their lead and use the same check. If you think the specification is wrong, please report the issue to them. If you have different requirements, considerusing a custom method.In case you need to adjust the built-in validation regular expression patterns, pleasefollow the documentation.

IMPORTANT NOTE ABOUT REQUIRED METHOD. As of version 1.14.0 this plugin stops trimming white spaces from the value of the attached element. If you want to achieve the same result, you can use thenormalizer that can be used to transform the value of an element before validation. This feature was available sincev1.15.0. In other words, you can do something like this:

$("#myForm").validate({rules:{username:{required:true,// Using the normalizer to trim the value of the element// before validating it.//// The value of `this` inside the `normalizer` is the corresponding// DOMElement. In this example, `this` references the `username` element.normalizer:function(value){return$.trim(value);}}}});

For an invalid field, the default output for the jQuery Validation Plugin is an error message in a<label> element. This results in two<label> elements pointing to a single input field using thefor attribute. While this is valid HTML, it has inconsistent support across screen readers.

For greater screen reader support in your form's validation, use theerrorElement parameter in thevalidate() method. This option outputs the error in an element of your choice and automatically adds ARIA attributes to the HTML that help with screen reader support.

aria-describedby is added to the input field and it is programmatically tied to the error element chosen in theerrorElement parameter.

$("#myform").validate({errorElement:"span"});

<labelfor="name">Name</label><inputid="name"aria-describedby="unique-id-here"><spanclass="error"id="unique-id-here">This field is required</span>

Learn more about errorElement

Copyright © Jörn Zaefferer
Licensed under the MIT license.