0

I am using a TextFormField as a widget and TextEditingController inside TextFormField for a phone number, and I am trying to validate a number while typing with the flutter_libphonenumber library, which provides an async function for validation. I am trying to change the colour of the text depending upon validation status while entering it.

Current state:

  1. Implemented TextFormField and providing it TextEditingController as a controller with valid initial text.
  2. Implemented onFieldSubmitted and it works fine on tap of Done button of the keyboard.
  3. Added listener to this controller for validation and set _isValid bool there.
  4. I have used this bool to set colour of text inside the controller while building it.
  5. So the current issue is, when I am entering text I get proper validated status inside the listener, but the colour of text is not changing accordingly.

I understand this is happening due to not calling setState after validation, so it will rebuild the widget and change the colour according to _isValid.

Error: When I try to setState inside the listener, it just doesn't allow editing.

Note: I have tried the same approach using onChanged method and it also does same, cannot enter or delete anything inside textField if there is pre-populated text (initialText).

Can anyone help me to solve this issue, or guide the correct path?

Thank you!

Mobile_Dev
  • 91
  • 6

1 Answers1

0

You can use the Form widget's autovalidate field by doing

Form(
 autovalidate: true
ahmetakil
  • 879
  • 6
  • 15
  • Tried `autovalidateMode: AutovalidateMode.onUserInteraction` it also doesn’t allow editing if it has any valid initial text. – Mobile_Dev Mar 15 '21 at 13:03