Validators
The richest validators in the class
FormValidation comes with various built-in validators listed in alphabetical order, split into two groups as follows:
Popular validators
In most cases, this list covers validators you often need. All these validators are included in the bundle/popular(.min).js
file.
Special validators
The following list includes special validators which you often don't need most of the time. In order to use them, you have to include the bundle/full(.min).js
file on your page.
Look at the
custom validator page to see how you can create and reuse your own validator
Using validator globally
You can use any validator globally under the namespace FormValidation.validators
in the browser if the page includes the bundle/popular(.min).js
or bundle/full(.min).js
script.
The following sample code demonstrates how to use the
creditCard validator to validate a credit card number:
<script src="/vendors/@form-validation/umd/bundle/popular.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function (e) {
const result = FormValidation.validators.creditCard().validate({
value: '340653705597107',
options: {
message: 'The credit card number is not valid',
},
});
});
</script>
Using validator in ES6 module
All validators are able to be imported and used with the ES6 module. It's super useful if you want to use a validator with front-end frameworks (such as
React,
VueJS,
Svelte, .etc), or in a server environment with NodeJS frameworks (such as
Express).
The following snippet shows how to use the creditCard validator with the ES6 module:
import { creditCard } from '/path/to/@form-validation/cjs/validator-credit-card';
const result = creditCard().validate({
value: '340653705597107',
options: {
message: 'The credit card number is not valid',
},
});
Using validator from npm packages
From v2.0.0, the entire FormValidation library including its validators and plugins are available as npm packages. You can install a package and use it. The following snippet shows how to use the creditCard validator.
- Install the validator package:
$ npm install @form-validation/validator-credit-card
- Use the
creditCard
validator:
import { creditCard } from '@form-validation/validator-credit-card';
const result = creditCard().validate({
value: '340653705597107',
options: {
message: 'The credit card number is not valid',
},
});