Enabling Declarative Validation Rules (DVR)
We are using skaterdav85/validatorjs to enable Declarative Validation Rules (DVR) with automatic Error Messages.
Install skaterdav85/validatorjs
Package
skaterdav85/validatorjs
is not included in the package, so you have to install it manually.
npm install --save validatorjs
Define a plugins object
Pass the validatorjs
package to the DVR plugin.
import dvr from 'mobx-react-form/lib/validators/DVR';
import validatorjs from 'validatorjs';
const plugins = {
dvr: dvr({ package: validatorjs })
};
VERSION < 6.9.0
Shortcut:
import dvr from 'mobx-react-form/lib/validators/DVR';
import validatorjs from 'validatorjs';
const plugins = {
dvr: dvr(validatorjs)
};
VERSION < 1.37
No need to import the plugin function:
import validatorjs from 'validatorjs';
const plugins = {
dvr: validatorjs
};
Add the rules
property to the form fields
Check the Available Rules
const fields = {
username: {
label: 'Username',
value: 'SteveJobs',
rules: 'required|string|between:5,15',
},
email: {
label: 'Email',
value: 's.jobs@apple.com',
rules: 'required|email|string|between:5,15',
},
};
Create the form passing the plugins
object
new Form({ fields }, { plugins });