How to disable focusOnInvalid when using AutovalidateMode.onUserInteraction

[BrottarBasse]

With version 8.0 i can't find a way to set the focusOnInvalid property for validation executed by the autoValidateMode

[deandreamatias]

Can show me a minimal example?
If autovalidate mode is enable to validate, that's means that validation is managed by native Form (from Flutter).
I don't sure but I guess that this package can't override this behavior.

On validate methods has a documentation related with this:

Note: If a invalid field is from type TextField and will focused,
the form will auto scroll to show this invalid field.
In this case, the automatic scroll happens because is a behavior inside the framework,
not because [autoScrollWhenFocusOnInvalid] is true.

[BrottarBasse]

import 'package:flutter/material.dart';
import 'package:flutter_form_builder/flutter_form_builder.dart';
import 'package:form_builder_validators/form_builder_validators.dart';

class LoginView extends StatefulWidget {
  const LoginView({Key? key}) : super(key: key);

  @override
  State<LoginView> createState() => _LoginViewState();
}

class _LoginViewState extends State<LoginView> {
  final _formKey = GlobalKey<FormBuilderState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: FormBuilder(
          // The validation done by autoValidateMode will always focus on invalid
          // this was not the case in version 7.8.0
          autovalidateMode: AutovalidateMode.onUserInteraction,
          key: _formKey,
            child: Column(
          children: [
            FormBuilderTextField(
              name: "email",
              keyboardType: TextInputType.emailAddress,
              decoration: const InputDecoration(
                labelText: "Email",
              ),
              validator: FormBuilderValidators.compose([
                FormBuilderValidators.required(errorText: "Email is required"),
                FormBuilderValidators.email(errorText: "Invalid email address"),
              ]),
            ),
            SizedBox(height: 20),
            FormBuilderTextField(
              name: "password",
              obscureText: true,
              decoration: const InputDecoration(
                labelText: "Password",
              ),
              validator: FormBuilderValidators.compose([
                FormBuilderValidators.required(
                    errorText: "Password is required"),
                FormBuilderValidators.minLength(8,
                    errorText: "Password must be at least 8 characters long"),
              ]),
            ),
            SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  // The validation done by saveAndValidate seem to focusOnInvalid even if set to false
                  if (_formKey.currentState?.saveAndValidate(focusOnInvalid: false) ??
                      false) {
                    final email = _formKey.currentState!.fields["email"]!.value;
                    final password =
                        _formKey.currentState!.fields["password"]!.value;
                    print("Email: $email, Password: $password");
                  }
                },
                child: Text("Login")),
          ],
        )),
      ),
    );
  }
}

[deandreamatias]

This it's about the note that I send before

Note: If a invalid field is from type TextField and will focused,
the form will auto scroll to show this invalid field.
In this case, the automatic scroll happens because is a behavior inside the framework,
not because [autoScrollWhenFocusOnInvalid] is true.

[BrottarBasse]

Im not talking about it scrolling to the invalid field, Im talking about the invalid field requesting focus automatically at all.
This was not the case in 7.8.0....
Here is a work around to the issue for validate on interaction but having to use this work around to disable focusOnInvalid doesn't seem like an intended feature and begs the question why autoValidateMode is even present

import 'package:flutter/material.dart';
import 'package:flutter_form_builder/flutter_form_builder.dart';
import 'package:form_builder_validators/form_builder_validators.dart';

class LoginView extends StatefulWidget {
  const LoginView({Key? key}) : super(key: key);

  @override
  State<LoginView> createState() => _LoginViewState();
}

class _LoginViewState extends State<LoginView> {
  final _formKey = GlobalKey<FormBuilderState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: FormBuilder(
          // autovalidateMode: AutovalidateMode.onUserInteraction,
          key: _formKey,
            child: Column(
          children: [
            FormBuilderTextField(
              name: "email",
              keyboardType: TextInputType.emailAddress,
              decoration: const InputDecoration(
                labelText: "Email",
              ),
              validator: FormBuilderValidators.compose([
                FormBuilderValidators.required(errorText: "Email is required"),
                FormBuilderValidators.email(errorText: "Invalid email address"),
              ]),
              onChanged: (value) {
                // Here we implement validation on user interaction in the fields themselves
                // and the code work as expected.
                _formKey.currentState?.fields["email"]?.validate(focusOnInvalid: false);
              },
            ),
            SizedBox(height: 20),
            FormBuilderTextField(
              name: "password",
              obscureText: true,
              decoration: const InputDecoration(
                labelText: "Password",
              ),
              validator: FormBuilderValidators.compose([
                FormBuilderValidators.required(
                    errorText: "Password is required"),
                FormBuilderValidators.minLength(8,
                    errorText: "Password must be at least 8 characters long"),
              ]),
              onChanged: (value) {
                // Here we implement validation on user interaction in the fields themselves
                // and the code work as expected.
                _formKey.currentState?.fields["password"]?.validate(focusOnInvalid: false);
              },
            ),
            SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  // The validation done by saveAndValidate seem to focusOnInvalid even if set to false
                  if (_formKey.currentState?.saveAndValidate(focusOnInvalid: false) ??
                      false) {
                    final email = _formKey.currentState!.fields["email"]!.value;
                    final password =
                        _formKey.currentState!.fields["password"]!.value;
                    print("Email: $email, Password: $password");
                  }
                },
                child: Text("Login")),
          ],
        )),
      ),
    );
  }
}

[deandreamatias]

Ok. I can investigate this
Please open a issue of type bug with all related problem
Thanks!