Validations

By default, all fields comes with Required Validations, just put fRequired in the fields, and that's it!
<Form inspect>
    {// Declareted }
    <Field fName='latitude' fRequired>
        {(fieldBidings, fieldStatus) => <input {...fieldBidings} />}
    </Field>
    
    {// Factored }
    <InputField fName={'name'} fRequired/>
</Form>
Custom Validations
Note that every validator should be a FieldValidator type.
Sync Validations
Sync validations should return undefinedif everything is ok, or an error message if anything is not ok.
export const myRequiredValidator: FieldValidator = (value: any) => {
    return value ? undefined : 'This fied is required...'
}
Async Validations
Async validations you should return an CancelableValidator, that is a tool that allow the validation engine to cancel the validation process. To avoid receiving results that are not welcome anymore, like an user verification, that is triggered as the user types...
export const delayedBobValidator: FieldValidator = (value: any) => {
    return CancelableValidator((done, cancel) => {
        const timerId = setTimeout(() => {
            done(value == 'bob' ? undefined : `No Bob... was "${value}"`);
         }, 2000);
         
         cancel(() => { clearTimeout(timerId) })
    })
}
Using your validators
// Declarated
<Field fName='name' fExtraValidators={[delayedBobValidator, myRequiredValidator]}>
    {(props) => <input {...props} />}
</Field>
​
// Factored
<InputField fname='name' fExtraValidators={[delayedBobValidator, myRequiredValidator]}/>
Quick start - Previous
Custom Field Factory
Next - Components
Form
Last updated 1 year ago