Search code examples
formsflutterdart

How to validate a text field on value changed?


How to autovalidate a text form field when its value changes?

i tried

bool _autoValidate = false;
TextFormField(
                autovalidate: _autoValidate ,
                onChanged: (value) {
                  setState(() {
                    _autoValidate = true;
                  });
                },
                validator: (value) {
                  if (value.length < 5) {
                    return 'False';
                  } else {
                    return 'True';
                  }
                },
              ),

But not working, TextFormField still doesn't show errors on validation.

I need a way to turn on the validation on text changed.


Solution

  • Flutter has now an API to validate a form field only when the content changes. You just need to use the autovalidateMode parameter and set it to AutovalidateMode.onUserInteraction.

    The following text field will only validate when the user changes its content:

        class HomeScreen extends StatelessWidget {
          @override
          Widget build(BuildContext context) {
            return Scaffold(
              appBar: AppBar(),
              body: Center(
                child: TextFormField(
                  autovalidateMode: AutovalidateMode.onUserInteraction,
                ),
              ),
            );
          }
        }
    

    See AutovalidateMode docs for more options in when to validate.

    This API is now available on the latest stable channel. Let me know if it solves your problem.