flutter_form_builder
flutter_form_builder copied to clipboard
[General]: Validation focuses latest invalid field instead of first
Is there an existing issue for this?
- [X] I have searched the existing issues
Package/Plugin version
9.2.1
Platforms
- [X] Android
- [X] iOS
- [ ] Linux
- [ ] MacOS
- [ ] Web
- [ ] Windows
Flutter doctor
Flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.16.8, on macOS 14.4.1 23E224 darwin-arm64, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2023.1)
[✓] VS Code (version 1.89.1)
[✓] Connected device (4 available)
[✓] Network resources
• No issues found!
Minimal code example
Code sample
final _formKey = GlobalKey<FormState>();
Widget build(BuildContext context) {
return(Column(children: [
Form(key: _formKey, child: Column(children: [
FormBuilderTextField(
name: 'firstname',
autovalidateMode: AutovalidateMode.onUserInteraction,
initialValue: '',
onChanged: (text) {},
validator: (value) {
return 'Required';
},
),
SizedBox(height: 30, width: 30),
FormBuilderTextField(
name: "lastname",
autovalidateMode: AutovalidateMode.onUserInteraction,
initialValue: '',
onChanged: (text) {},
validator: (value) {
return 'Required';
},
),
SizedBox(height: 30, width: 30),
FormBuilderDateTimePicker(
name: "date_of_birthday",
autovalidateMode: AutovalidateMode.onUserInteraction,
inputType: InputType.date
initialDate: DateTime(DateTime.now().year - 30, 1, 1),
onChanged: (text) {},
validator: (value) {
return 'Required';
},
)
]),
TextButton(onPressed: () {_formKey.currentState?.validate() },child: Text('Submit'))
]));
Current Behavior
I have form with many FormBuilderTextFields, and some of them are required - (they have validator that checks if its value empty or not), when i am trying to submit the form, calling validation - _formKey.currentState?.validate(), the latest invalid FormField is being focused instead of first one. In my case the latest is FormBuilderDateTimePicker, so when i pres "Submit", the date picker is being opened.
Expected Behavior
After validation, the first invalid Field in the tree should be focused.
Steps To Reproduce
Aditional information
I suppose this is not desired behaviour, but if from some unknown reason that i haven't found this is wanted. Is there at least some way to prevent date picker from opening its picker / dialog ?
I also think that this issue is related to this - https://github.com/flutter-form-builder-ecosystem/flutter_form_builder/issues/1253, where the focused were jumped to the latest input despite there were also another invalid input above No response
Related with https://github.com/flutter-form-builder-ecosystem/flutter_form_builder/discussions/1297
The solution at #1253 is still valid. I tried several things like unfocusing via a delayed future, nothing works except for that solution. uncomment or remove autovalidateMode: AutovalidateMode.always, at the field and random focussing on fields is gone.
I can't reproduce this bug with the code sample. In the code example it says that the widget used is Form (native of Flutter) and not FormBuilder. Maybe that is the error. Try to use this to encompass the FormBuilder form fields:
final GlobalKey<FormBuilderState> _formKey = GlobalKey<FormBuilderState>();
FormBuilder(...)
@deandreamatias that was it... When i changed it to FormBuilderState it started working and started focusing from the top. Thank you a lot and sorry, now it seemed to me like this issue belonged to stackoverflow since it was a bug in my code. I am closing the issue