https://github.com/stemmlerjs/react-joi-forms
Model-based React form validation with Joi
https://github.com/stemmlerjs/react-joi-forms
Last synced: 2 months ago
JSON representation
Model-based React form validation with Joi
- Host: GitHub
- URL: https://github.com/stemmlerjs/react-joi-forms
- Owner: stemmlerjs
- Created: 2019-05-15T00:05:23.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2019-05-15T00:12:37.000Z (about 6 years ago)
- Last Synced: 2025-04-12T02:09:31.273Z (2 months ago)
- Language: TypeScript
- Size: 3.91 KB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Form Validation
> A way to do clean form validation and validate an entire model or attributes on that model! This small lib is currently how I do form validation onBlur and onChange with React + Redux applications.
_This isn't quite ready yet! Just FYI, but feel free to have a peek_
## Creating a new form!
You can create a new form by using the Form class like this:
```typescript
let form = new Form([
{ fieldName: 'jobTitle', validator: Joi.string().min(2).max(60).required(), type: ValidatorType.JOI },
{ fieldName: 'isPayingJob', validator: Joi.bool().required(), type: ValidatorType.JOI },
{ fieldName: 'paidJobDetails', validator: paidJobDetailsValidator, type: ValidatorType.CUSTOM },
])
```
A form takes in an array of ```Field``` objects like so!
## Usage
+ Form
+ validateForm (formData: any) : boolean
+ validateFormField (field: string, value: any) : boolean
These are the two most important methods on the form class. With this, we can validate the entire form,
or we can just validate a specific form field.
### Validator Types
We have two types of validators.
1. JOI validator
2. Custom validator
#### Joi Validator
To validate a field using the Joi Validator, create a Joi validation chain on the ```validator``` key for the field.
#### Custom Validator
We can also create our own custom validator. Custom validators need to implement the ```ICustomValidator``` interface.# react-joi-forms
## Example
Coming soon