Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jzaefferer/jquery-validation
jQuery Validation Plugin library sources
https://github.com/jzaefferer/jquery-validation
inline-validation javascript jquery jquery-validation
Last synced: 8 days ago
JSON representation
jQuery Validation Plugin library sources
- Host: GitHub
- URL: https://github.com/jzaefferer/jquery-validation
- Owner: jquery-validation
- License: mit
- Created: 2010-05-05T13:40:20.000Z (over 14 years ago)
- Default Branch: master
- Last Pushed: 2024-07-17T09:45:33.000Z (5 months ago)
- Last Synced: 2024-10-29T17:55:43.470Z (about 2 months ago)
- Topics: inline-validation, javascript, jquery, jquery-validation
- Language: JavaScript
- Homepage: https://jqueryvalidation.org/
- Size: 8.06 MB
- Stars: 10,347
- Watchers: 446
- Forks: 2,784
- Open Issues: 46
-
Metadata Files:
- Readme: README.md
- Changelog: changelog.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE.md
- Security: SECURITY.md
Awesome Lists containing this project
- awesome-javascript - jquery-validation - jQuery Validation Plugin library sources - ★ 9128 (Validation)
- awesome-javascript-cn - 官网
README
[jQuery Validation Plugin](https://jqueryvalidation.org/) - Form validation made easy
================================
[](https://github.com/jquery-validation/jquery-validation/releases/latest)
[](https://github.com/jquery-validation/jquery-validation/actions/workflows/ci.yml)
[](https://david-dm.org/jquery-validation/jquery-validation#info=devDependencies)
[](https://www.jsdelivr.com/package/npm/jquery-validation)
The jQuery Validation Plugin provides drop-in validation for your existing forms, while making all kinds of customizations to fit your application really easy.
## Getting Started
### Downloading the prebuilt files
Prebuilt files can be downloaded from https://jqueryvalidation.org/
### Downloading the latest changes
The unreleased development files can be obtained by:
1. [Downloading](https://github.com/jquery-validation/jquery-validation/archive/master.zip) or Forking this repository
2. [Setup the build](CONTRIBUTING.md#build-setup)
3. Run `grunt` to create the built files in the "dist" directory
### Including it on your page
Include jQuery and the plugin on a page. Then select a form to validate and call the `validate` method.
```html
$("form").validate();
```
Alternatively include jQuery and the plugin via requirejs in your module.
```js
define(["jquery", "jquery.validate"], function( $ ) {
$("form").validate();
});
```
For more information on how to setup a rules and customizations, [check the documentation](https://jqueryvalidation.org/documentation/).
## Reporting issues and contributing code
See the [Contributing Guidelines](CONTRIBUTING.md) for details.
**IMPORTANT NOTE ABOUT EMAIL VALIDATION**. As of version 1.12.0 this plugin is using the same regular expression that the [HTML5 specification suggests for browsers to use](https://html.spec.whatwg.org/multipage/forms.html#valid-e-mail-address). 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, consider [using a custom method](https://jqueryvalidation.org/jQuery.validator.addMethod/).
In case you need to adjust the built-in validation regular expression patterns, please [follow the documentation](https://jqueryvalidation.org/jQuery.validator.methods/).
**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 the [`normalizer`](https://jqueryvalidation.org/normalizer/) that can be used to transform the value of an element before validation. This feature was available since `v1.15.0`. In other words, you can do something like this:
``` js
$("#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);
}
}
}
});
```
## Accessibility
For an invalid field, the default output for the jQuery Validation Plugin is an error message in a `` element. This results in two `` elements pointing to a single input field using the `for` attribute. While this is valid HTML, it has inconsistent support across screen readers.
For greater screen reader support in your form's validation, use the `errorElement` parameter in the `validate()` 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 the `errorElement` parameter.
``` js
$("#myform").validate({
errorElement: "span"
});
```
``` html
Name
This field is required
```
[Learn more about errorElement](https://jqueryvalidation.org/validate/#errorelement)
## License
Copyright © Jörn Zaefferer
Licensed under the MIT license.