How can I add a custom form validation for a TextField?

Actions & Logic

On a product creation screen, I have a TextField that allows the user to enter a new, unique product name.

As the user types in this TextField, I want the app to check the product list---a persisted List<String> containing all of the unique product names used in the app---and validate whether or not the product name has already been taken.

If the name has already been taken, I would like the TextField to show the error, "There is already a product with this name," under the TextField (in a similar manner to the Form validation error messages, with the red border and red error text below the field).

What have you tried so far?

I have added an "On Changed" action to search the product name list, but I can't quite seem to figure out how to either trigger the validation error state for the TextField or to manually change the border color and add the error text to the TextField.

The FlutterFlow documentation on Form Validation for TextFields does not seem to cover any ability for the user to add a custom validation; the only ones covered seem to be of empty state, autocomplete, min/max character limits, and input format validations.

Did you check FlutterFlow's Documentation for this topic?
Yes
3
5 replies