injectForm static method
- AutovalidateMode autovalidateMode = AutovalidateMode.disabled,
- bool autoFocusOnFirstError = true,
- @Deprecated('Use submissionSideEffects') void onSubmitting()?,
- @Deprecated('Use submissionSideEffects') void onSubmitted()?,
- SideEffects? submissionSideEffects,
- Future<
void> submit()?, - bool? isEnabled,
- bool? isReadOnly,
Inject a form that controls all TextField and OnFormFieldBuilder instantiated inside its builder method.
If the application you are working on contains dozens of TextFields,
it becomes tedious to process each field individually. Form
helps us
collect many TextFields and manage them as a unit.
With InjectedForm you can validate all input fields in the front end, submit them and do server side validation.
Example: Supposing we have already defined email and password InjectedTextEditing
final form = RM.injectForm(
submit: () async {
//This is the default submission logic,
//It may be override when calling form.submit( () async { });
//It may contains server validation.
await serverError = authRepository.signInWithEmailAndPassword(
email: email.text,
password: password.text,
);
//after server validation
if(serverError == 'Invalid-Email'){
email.error = 'Invalid email';
}
if(serverError == 'Weak-Password'){
email.error = 'Password must have more the 6 characters';
}
},
);
Once InjectedForm.submit is invoked, input field are first validate in the front end. If they are valid, submit is called. After waiting for submission, if it ends with server error we set it our field to display the server validation.
See also :
- OnFormBuilder to listen to InjectedForm.
- OnFormFieldBuilder to listen to the injected input.
- InjectedTextEditing to inject a TextEditingController,
Parameters:
autovalidateMode
: Optional AutovalidateMode. Defaults to AutovalidateMode.disabled
The auto validation mode of the form. It can take one of three enumeration values:
AutovalidateMode.disable
: The form is validated manually by callingform.validate()
AutovalidateMode.always
: The form is always validatedAutovalidateMode.onUserInteraction
: The form is not validated until the user has started typing.
If autovalidateMode is set to AutovalidateMode.always
or
AutovalidateMode.onUserInteraction
, It overrides the value of
autoValidateValueChange
of its child InjectedTextEditing or
InjectedFormField.
autoFocusOnFirstError
: Optional bool. Defaults to true
After the form is validated, get focused on the first non valid TextField, if any.
submit
: Optional callback.
Contains the user submission logic. Called when invoking InjectedForm.submit method.
submissionSideEffects
: Optional SideEffects.
Use to invoke side effects.
onSubmitting
: Optional callback.
Callback for side effects called while waiting for form submission
onSubmitted
: Optional callback.
Callback for side effects called if the form successfully submitted.
See OnFormBuilder.isEnabledRM for an example of disabling a inputs while waiting for the form submission.
isEnabled
: Optional bool.
When false all form fields are desabled at start up. To enable or disable form field at runtime use InjectedForm.isFormEnabled.
isReadOnly
: Optional bool.
When false all form fields are read only at start up. To toggle the read-only property of fields use InjectedForm.isFormReadOnly.
Implementation
static InjectedForm injectForm({
AutovalidateMode autovalidateMode = AutovalidateMode.disabled,
bool autoFocusOnFirstError = true,
@Deprecated('Use submissionSideEffects') void Function()? onSubmitting,
@Deprecated('Use submissionSideEffects') void Function()? onSubmitted,
SideEffects? submissionSideEffects,
Future<void> Function()? submit,
bool? isEnabled,
bool? isReadOnly, //TODO document
// void Function(dynamic, void Function())? onSubmissionError,
}) {
return InjectedFormImp(
autovalidateMode: autovalidateMode,
autoFocusOnFirstError: autoFocusOnFirstError,
sideEffects: SideEffects(
initState: () => submissionSideEffects?.initState?.call(),
dispose: () => submissionSideEffects?.dispose?.call(),
onAfterBuild: () => submissionSideEffects?.onAfterBuild?.call(),
onSetState: (snap) {
if (snap.isWaiting) {
onSubmitting?.call();
} else if (snap.hasData) {
onSubmitted?.call();
}
submissionSideEffects?.onSetState?.call(snap);
},
),
submit: submit,
isEnabled: isEnabled,
isReadOnly: isReadOnly,
);
}