How to reset (clear) the form fields in flutter app? once the data is submitted to the server?
In my app, I'm having 2 pages.
1st page to enter the form details, like name, address etc
2nd page is to upload images.
1st page pushes the data to the 2nd page. (Here I'm not doing push replacement, means 2nd page sits on top of first page)
2nd page is to select the images, and uploads the form data and images to the server.
My Problem is
How to reset the all 2 pages, once the upload is complete?
I'm using firebase server to upload my data!
Thanks, In advance
Use, for example, a GlobalKey<FormState>
to access the form states and reset()
the fields.
With this in mind, you can either:
class Screen1 extends StatefulWidget {
_Screen1State createState() => _Screen1State();
}
class _Screen1State extends State<Screen1> {
final _formKeyScreen1 = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('First screen'),
),
body: Center(
child: Form(
key: _formKeyScreen1,
child: Column(
children: <Widget>[
TextFormField(),
TextFormField(),
TextFormField(),
RaisedButton(
child: Text('Navigate to second screen...'),
onPressed: () => Navigator.of(context).push(MaterialPageRoute(
builder: (BuildContext context) => Screen2(_formKeyScreen1),
)),
)
],
),
),
),
);
}
}
class Screen2 extends StatefulWidget {
final GlobalKey<FormState> firstScreenFormKey;
Screen2(this.firstScreenFormKey);
_Screen2State createState() => _Screen2State();
}
class _Screen2State extends State<Screen2> {
final _formKeyScreen2 = GlobalKey<FormState>();
void _processData() {
// Process your data and upload to server
_formKeyScreen2.currentState?.reset();
widget.firstScreenFormKey?.currentState?.reset();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Second screen'),
),
body: Center(
child: Form(
key: _formKeyScreen2,
child: Column(
children: <Widget>[
TextFormField(),
TextFormField(),
TextFormField(),
RaisedButton(
child: Text('Submit data'),
onPressed: () => _processData(),
)
],
),
),
),
);
}
}
class Screen1 extends StatefulWidget {
_Screen1State createState() => _Screen1State();
}
class _Screen1State extends State<Screen1> {
final _formKeyScreen1 = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('First screen'),
),
body: Center(
child: Form(
key: _formKeyScreen1,
child: Column(
children: <Widget>[
TextFormField(),
TextFormField(),
TextFormField(),
RaisedButton(
child: Text('Navigate to second screen...'),
onPressed: () {
Navigator.of(context)
.push(MaterialPageRoute(
builder: (BuildContext context) => Screen2(),
))
.then((_) => _formKeyScreen1.currentState.reset());
},
)
],
),
),
),
);
}
}
class Screen2 extends StatefulWidget {
_Screen2State createState() => _Screen2State();
}
class _Screen2State extends State<Screen2> {
final _formKeyScreen2 = GlobalKey<FormState>();
void _processData() {
// Process your data and upload to server
_formKeyScreen2.currentState?.reset();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Second screen'),
),
body: Center(
child: Form(
key: _formKeyScreen2,
child: Column(
children: <Widget>[
TextFormField(),
TextFormField(),
TextFormField(),
RaisedButton(
child: Text('Submit data'),
onPressed: () => _processData(),
)
],
),
),
),
);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With