validator-forms v0.0.3
validator-forms
A pack of validation rules and helpers built on top of validator.js, focused on making forms validation more flexible and easier. Validator Forms will be handy if you use form libraries like react-final-form, redux-form, formik and others.
Installation
You might need to use Validator itself, so it is a peer dependency and should be installed separately.
npm install --save validator-forms validatoror
yarn add validator-forms validatorGetting Started
All the validation rules provided by Validator Forms have signature (msg, ...opts) => val => [null | msg]. msg is a message to be displayed if validation fails, opts are the validation rule's properties. The returned function takes one parameter val which is a value to be validated, and returns null if the value passed the validation, msg otherwise.
A simple example of how it works with react-final-form:
import React from 'react';
import { Form, Field } from 'react-final-form';
import { required } from 'validator-forms';
const validatedFieldRequired = required('This field is required');
const MyValidatedForm = ({ onSubmit }) => (
<Form
onSubmit={onSubmit}
render={({ form, handleSubmit }) => (
<form onSubmit={handleSubmit}>
<Field name="validatedField" validate={validatedFieldRequired}>
{({ input, meta }) => (
<div>
<label>Required Field</label>
<input type="text" {...input} />
{meta.error && <span>{meta.error}</span>}
</div>
)}
</Field>
<button type="submit">Submit</button>
</form>
)}
/>
);Now if the the field is empty, This field is required will appear.
Validation Rules
Validator Forms provides all the validation rules from Validator as well as a few more, covering common form validation cases. For example, if you want to use isAlpha(str [, locale]) rule from Validator, the corresponding rule will be
import { isAlpha } from 'validator-forms';
// under the hood it's pretty much
// (msg, locale) => val => validator.isAlpha(val, locale) ? null : msg;The first parameter of a helper is always msg which will be returned if validation fails. The rest of the parameters are parameters of the original validation rule. You can check them in documentation.
The returned value is a function taking a single argument val and returning null if val passes the validation, msg otherwise.
You don't have to sanitize input values for validation rules, nulls, undefineds and everything else will be processed correctly.
API
Validator-like rules
All the validation rules from Validator have equivalents in Validator Forms with signature (msg, ...opts) => val => [null | msg] (read more in Validation Rules section).
You can check them in documentation for Validator.
Custom rules
| Rule | Description |
|---|---|
| required(msg) | checks if applied string is not null or whitespace. |
| maxLength(msg, maxLength) | checks if applied string's length is less than maxLength |
| minLength(msg, minLength) | checks if applied string's length is greater than minLength |
| lengthBetween(msg, minLength, maxLength) | checks if applied string's length falls in a range between minLength and maxLength. |
Helpers for Complex Validation Cases
In many cases you need to do multiple checks for a single value. For example, you want to show This field is required if the input is empty and This field must be shorter than 10 symbols if it's too long. For such situations Validator Forms provides helpers.
applyRules(rules) => val => null | msg where rules is a single Validator Forms rule or an array of rules. Returns a function taking a single argument val and applying it to all the provided validation rules. Returns null if all the checks passed or msg of the first failed check.
applyRulesReturnAll(rules) => val => null | msgs. Similar to applyRules but unlike it applyRulesReturnAll returns msgs array of all error messages of the failed checks, if there are any, null otherwise.
applyIfNotEmpty(rules) => val => null | msg where rules is a singleValidator Forms rule or an array of rules. Returns a function taking a single argument val and applying it to all the provided validation rules only if val is not empty. The returned function returns null if all the checks are passed or msg of the first failed check.
applyIfNotEmptyReturnAll(rules) => val => null | msgs. Similar to applyIfNotEmpty but unlike it applyIfNotEmptyReturnAll returns msgs array of all error messages of the failed checks, if there are any, null otherwise.
Note that val is considered empty if it contains only whitespaces.
License
MIT