When using globalKey.currentState?.saveAndValidate to save and validate a form, a date picker will pop up.

[InTheClodus]

Is there an existing issue for this?

• I have searched the existing issues

Package/Plugin version

9.1.1

Platforms

• Android
• iOS
• Linux
• MacOS
• Web
• Windows

Flutter doctor

Flutter doctor

[√] Flutter (Channel stable, 3.16.2, on Microsoft Windows [版本 10.0.19045.3930], locale zh-CN)
    • Flutter version 3.16.2 on channel stable at D:\flutterSDK3.7.1\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 9e1c857886 (7 weeks ago), 2023-11-30 11:51:18 -0600
    • Engine revision cf7a9d0800
    • Dart version 3.2.2
    • DevTools version 2.28.3
    • Pub download mirror https://pub.flutter-io.cn
    • Flutter download mirror https://storage.flutter-io.cn

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
    • Android SDK at C:\Users\86136\AppData\Local\Android\Sdk
    • Platform android-34, build-tools 33.0.1
    • ANDROID_HOME = C:\Users\86136\AppData\Local\Android\Sdk
    • ANDROID_SDK_ROOT = C:\Users\86136\AppData\Local\Android\Sdk
    • Java binary at: D:\software\AndroidStudio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[X] Visual Studio - develop Windows apps
    X Visual Studio not installed; this is necessary to develop Windows apps.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components

[!] Android Studio (version 2022.2)
    • Android Studio at D:\software\AS
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    X Unable to determine bundled Java version.
    • Try updating or re-installing Android Studio.

[√] Android Studio (version 2022.3)
    • Android Studio at D:\software\AndroidStudio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)

Minimal code example

Code sample

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

void main() {
  return runApp(AppTest());
}

class AppTest extends StatefulWidget {
  const AppTest({super.key});

  @override
  State<AppTest> createState() => _AppTestState();
}

class _AppTestState extends State<AppTest> {

  final GlobalKey<FormBuilderState> _globalKey = GlobalKey<FormBuilderState>();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home:  Scaffold(
          appBar: AppBar(
            title: Text("Test"),
          ),
          body: SingleChildScrollView(
            child: FormBuilder(
              key: _globalKey,
              child: Column(
                children: [
                  FormBuilderTextField(
                    name: "account",
                    decoration: const InputDecoration(
                      hintText: "LOGIN ID",
                    ),
                    validator: FormBuilderValidators.compose([
                      FormBuilderValidators.required(
                          errorText: "This field is required"),
                    ]),
                  ),
                  FormBuilderTextField(
                    name: "password",
                    decoration: const InputDecoration(
                      hintText: "Password",
                    ),
                    validator: FormBuilderValidators.compose([
                      FormBuilderValidators.required(
                          errorText: "This field is required"),
                    ]),
                  ),
                  FormBuilderDateTimePicker(
                    name: 'licenceEndDate',
                    inputType: InputType.date,
                    validator: FormBuilderValidators.compose([
                      FormBuilderValidators.required(
                          errorText: "This field is required"),
                    ]),
                    decoration: InputDecoration(
                      isCollapsed: true,
                      contentPadding: const EdgeInsets.symmetric(
                        horizontal: 10,
                        vertical: 10,
                      ),
                      filled: true,
                      errorText: '',
                      hintText: "DriverLicenseExpiryDate",
                      hintStyle: const TextStyle(
                        color: Color(0xFF979696),
                        fontSize: 18,
                      ),
                      border: OutlineInputBorder(
                        borderSide: BorderSide.none,
                        borderRadius: BorderRadius.circular(2.0),
                      ),
                    ),
                  ),
                  ElevatedButton(
                    onPressed: (){
                      if (_globalKey.currentState?.saveAndValidate()??false) {
                        print(_globalKey.currentState!.value);
                      }
                    },
                    style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.all(Colors.blue),

                      shape: MaterialStateProperty.all(
                        RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(100)),
                      ),
                      minimumSize: MaterialStateProperty.all(
                        Size(double.infinity, 40),
                      ),
                    ),
                    child: Text(
                      "Next",
                      style: Theme.of(context)
                          .textTheme
                          .headlineSmall
                          ?.copyWith(fontWeight: FontWeight.w600),
                    ),
                  )
                ],
              ),
            ),
          ),
        ),

    );
  }
}

Current Behavior

I'm trying to register user information, and traditionally, I've been using saveAndValidate to validate the form information. However, today I noticed that using this method triggers the date picker to pop up, even though I have already selected the date and time.

Expected Behavior

Run the minimal example code above. After completing the input and selecting the date, it should print out the form content instead of triggering the date picker.

Steps To Reproduce

Flutter version 3.16.2
Dart version 3.2.2
• DevTools version 2.28.3

flutter pub get

flutter run

Aditional information

b1f8ae2560a03863be8121f0548562dd.mp4

[InTheClodus]

QQ2024119-102453.mp4

The video uploaded above is not very clear, so I have re-uploaded a new one.

[InTheClodus]

  Future<void> _handleFocus() async {
    if (effectiveFocusNode.hasFocus && enabled) {
      effectiveFocusNode.unfocus();
      await onShowPicker(context, value);
    }
  }

I found the issue lies within the code snippet above. This portion of the code exists within the FormBuilderDateTimePicker, where whenever the validate method is executed, it invariably reaches this point and triggers onShowPicker.

[Masadow]

Hi, I found that having a ChangeNotifier that rebuild a widget holding a FormBuilderDateTimePicker produces the same issue.

I also noticed that removing the required validator suppressed the issue even if it's not what we're looking for

[InTheClodus]

Hi, I found that having a ChangeNotifier that rebuild a widget holding a FormBuilderDateTimePicker produces the same issue.

I also noticed that removing the required validator suppressed the issue even if it's not what we're looking for

Yes, but there are many times where validator is required