FormProvider
component provide methods and states from validator to child components.
Component takes several props:
validator
- validator instance.Required
.
validator = new ModelValidator(ExampleModel);
validator = new SchemaValidator(ExampleSchema);
-
onSubmit
- method that triggers on submitting.Required
.cancelUpdate
object key indicates that form should not update state after submit.Optional
.
public onSubmit = async (modelValues: {[key: string]: string | boolean | number}): Promise<void | { cancelUpdate?: boolean }> => {
await someAction(modelValues);
}
errorParser
- method that triggers on unsuccessfully submitting.Optional
.
public errorParser = (error: any): Array<{ attribute: string, details: string }> | any => {
const parsedErrors = /*SOME ERROR PARSING CODE*/
return parsedErrors; /*OR SOMETHING ANOTHER*/
}
handleUnparsedErrors
- flag that specify should theForm
to handle errors thaterrorParser
returned when that errors cannot be applied to model.Optional
. Needed for UnparsedErrorProvider.
public handleUnparsedErrors: boolean;
beforeSubmit
- callback that triggers before submitting.Optional
.
public beforeSubmit: () => void;
afterSubmit
- callback that triggers after submitting.Optional
.
public afterSubmit: (hasErrors: boolean) => void;
Component provide next context interface:
onSubmit
- method that triggers on submitting.
public onSubmit: () => Promise<void>;
onValidate
- method that triggers on validating.
public onValidate: (groups?: Array<string>): Promise<void>;
setModelValue
- method for setting value for model/schema
public setModelValue: (attribute: string, value: {[key: string]: string | boolean | number}) => void;
hasErrors
- flag that indicates errors existing.
public get hasErrors(): boolean;
loading
- flag that indicates submit process.
public loading: boolean;
modelErrors
- object that contains validation errors
public modelErrors: {
[attributeName: string]: string;
}
modelValues
- object that contains model/schema values
public modelValues: {
[attributeName: string]: boolean | string | number;
}
unparsedError
- contains unparsed error
public unparsedError?: any;
unregisterElement
- method for unregister user interactive element
public unregisterElement: (attribute: string) => void;
registerElement
- method for register user interactive element
public registerElement: (attribute: string, element: any) => boolean | never;
registeredElements
- list of registered elemtns
public registeredElements: {[key: string]: { focus: () => void }}
import * as React from "react";
import { FormProvider, FormProviderProps } from "react-formawesome-core";
class MyFormWrapper extends React.Component<FormProviderProps> {
public render(): React.ReactNode {
return (
<FormProvider {...this.props}>
<form>
{this.props.children}
</form>
</FormProvider>
);
}
}