injectForm static method

InjectedForm injectForm({
  1. AutovalidateMode autovalidateMode = AutovalidateMode.disabled,
  2. bool autoFocusOnFirstError = true,
  3. @Deprecated('Use submissionSideEffects') void onSubmitting()?,
  4. @Deprecated('Use submissionSideEffects') void onSubmitted()?,
  5. SideEffects? submissionSideEffects,
  6. Future<void> submit()?,
  7. bool? isEnabled,
  8. 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 :

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 calling form.validate()
  • AutovalidateMode.always: The form is always validated
  • AutovalidateMode.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,
  );
}