React Form Validation
This Library allows validating React Forms easily with a collection of helpers and components.
Helpers: allow validating simple form (with no component or another component framework )
-
Validators:
- required
- minlength (by default 3 characters)
- maxlength (by default 30 characters)
- pattern (with a regular expression)
- custom (with a function)
- ( + isNullOrEmpty )
-
ValidationHelper allows validating a value, a property or a form model
- validateValue
- validateProperty
- validateAll
- ( + hasErrors, countErrors )
-
DOMFormHelper allows resolving element value
- getElementValue: returns the value of a form element (input, select, radio, etc.)
-
Util:
- omit
- clone
- extend
Components: allow to bind value and notify on value change (onValueChange) and on touch / blur (onTouch)
- Input
- Password (allows showing password)
- Checkbox
- CheckboxGroup
- Radio
- RadioGroup
- Select (multiple supported)
- TextArea
- LightGroup (allows showing error)
- FormGroup (allows showing error and success)
- Form
- Label (asterisk for required field)
- FontIcon (Icon with Font Awesome) + EyeIcon
- ErrorBlock
- Submit (could be disabled with errors)
- Reset (allows resetting to initial state)
Installation
npm i romagny13-react-form-validation -S
Requires Font Awesome. With a CDN:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
... Or with Webpack (+ css-loader):
npm i font-awesome -S
Documentation
Examples
To run examples npm i
then npm run dev