I am encountering the following error. I have a widget inside a form, it is an animated button to which I pass a callback to update some data. When I try to verify that the form is correct I find that in all cases _formKey.currentState is null.
There is two forms in the widget, don’t know if that could be a problem.
class _CustomerProfileAccountFormState
extends State<CustomerProfileAccountForm> {
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
final GlobalKey<FormState> _paswordFormKey = GlobalKey<FormState>();
Widget build(BuildContext context) {
final delegate = S.of(context);
const EdgeInsets verticalSpaceBetweenFields = EdgeInsets.all(8.0);
return FutureBuilder(
future: _userProfile,
builder: (context, AsyncSnapshot<UserProfile> snapshot) {
if (snapshot.hasData) {
return Column(children: [
Form(
child: Padding(
padding: const EdgeInsets.all(6),
key: _formKey,
child: Column(children: <Widget>[
Text(
delegate.your_account,
style: Theme.of(context).textTheme.headlineMedium,
),
Padding(
padding: verticalSpaceBetweenFields,
child: TextFormField(
controller: _formControllers['displayName'],
key: _displayNameKey,
style: TextinputStyles.standardStyle(context),
validator: (value) => Validators.maxLengthValidator(
value, displayNameMaxLength),
decoration:
TextinputStyles.profileInputDecoration(context)
.copyWith(labelText: delegate.displayName),
),
),
Padding(
padding: verticalSpaceBetweenFields,
child: AnimatedLoadingButton(
onPressed: _updateUserProfile,
initText: delegate.update_profile,
doneText: delegate.updated,
loadingText: delegate.updating,
errorText: delegate.error,
buttonState: buttonState,
)),
]),
),
),
Form(
child: Padding(
padding: const EdgeInsets.all(6),
key: _paswordFormKey,
child: Column(children: <Widget>[...
And the function where I need check the form
void _updateUserProfile() async {
try {
if (_formKey.currentState!.validate()) {
setState(() {
buttonState = ButtonLoadingState.loading;
});
Map<String, dynamic> data = {
"displayName": _formControllers['displayName']?.text
};
await userProfileVM.updateProfile(widget.uid, data);
setState(() {
buttonState = ButtonLoadingState.done;
});
}
} catch (error) {
setState(() {
buttonState = ButtonLoadingState.error;
});
globals.scaffoldMessengerKey.currentState!
.showSnackBar(SnackbarsHelper.showSnackbarError(error.toString()));
debugPrint('Error al obtener usuario: $error');
rethrow;
}
}
3
Answers
You must apply the key to the
Form
, not to thePadding
widget.You have the same issue with the second form.
It’s because you passing the
key
to thePadding
The key needs to be on the
Form
instead:Please pass the _formKey in Form widget instead of padding.
Example:-
key: _formKey
)