How clear textfields when I submit form with Flutter? - php

Question

I started learning Flutter and Dart yesterday and I am making a registration form for an app for Android and iOs. Save the table to the DB perfectly, but I can't refresh the view or clear the textfields, and before a message with "success registration" or "error, the passwords are not equals", for example.
This is my register form:
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:http/http.dart' as http;
import 'DashBoard.dart';
import 'main.dart';
class Register extends StatefulWidget {
#override
_RegisterState createState() => _RegisterState();
}
class _RegisterState extends State<Register> {
TextEditingController correo = TextEditingController();
TextEditingController celular = TextEditingController();
TextEditingController passwd = TextEditingController();
TextEditingController passwd2 = TextEditingController();
Future register() async {
var url =
"http://192.168.1.139/DataBase/register.php"; //IPv4, colocar después el hosting
var response = await http.post(url, body: {
"correo": correo.text,
"celular": celular.text,
"passwd": passwd.text,
"passwd2": passwd2.text,
});
var data = json.decode(response.body);
if (data == "Error") {
FlutterToast(context).showToast(
child: Text(
'User allready exit!',
style: TextStyle(fontSize: 25, color: Colors.red),
));
} else {
FlutterToast(context).showToast(
child: Text('Registration Successful',
style: TextStyle(fontSize: 25, color: Colors.green)));
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => DashBoard(),
),
);
}
}
#override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
// appBar: AppBar(
// // title: Text(
// // '',
// // style: TextStyle(fontWeight: FontWeight.bold),
// // ),
// ),
body: Container(
height: 900,
child: Card(
color: Colors.blueGrey,
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Register',
style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
decoration: InputDecoration(
labelText: 'Correo',
prefixIcon: Icon(Icons.person),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8)),
),
controller: correo,
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
decoration: InputDecoration(
labelText: 'Celular',
prefixIcon: Icon(Icons.person),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8)),
),
controller: celular,
keyboardType: TextInputType.number),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
obscureText: true,
decoration: InputDecoration(
labelText: 'Contraseña',
prefixIcon: Icon(Icons.lock),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8)),
),
controller: passwd,
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
obscureText: true,
decoration: InputDecoration(
labelText: 'Repita contraseña',
prefixIcon: Icon(Icons.lock),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8)),
),
controller: passwd2,
),
),
Row(
children: <Widget>[
Expanded(
child: MaterialButton(
color: Colors.pink,
child: Text('Regístrate',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.white)),
onPressed: () {
// correo.clear();
// celular.clear();
// passwd.clear();
// passwd2.clear();
register();
},
),
),
Expanded(
child: MaterialButton(
color: Colors.amber[100],
child: Text('Login',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.black)),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => MyHomePage(),
),
);
},
),
),
],
)
],
),
),
),
);
}
}
This is a example of Textfield and my submit button:
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
obscureText: true,
decoration: InputDecoration(
labelText: 'Contraseña',
prefixIcon: Icon(Icons.lock),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8)),
),
controller: passwd,
),
),
Row(
children: <Widget>[
Expanded(
child: MaterialButton(
color: Colors.pink,
child: Text('Regístrate',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.white)),
onPressed: () {
// correo.clear();
// celular.clear();
// passwd.clear();
// passwd2.clear();
register();
},
),
),
Write passwd.clear() don't works for me. I'm new in this, I don't know what I'm doing wrong, please help me, thanks

Answer 1

To clear the content in a controller you have to options
1- Use clear option
yourController.clear();
2- Asign empty text to controler
yourController.text = "";
And independent which one you use, you have to add an setState after like this
setState((){});

Answer 2

To clear the TextField or the TextFormField just use the clear() function like below :
TextEditingController textForm = TextEditingController();
//clear the TextFormField
textForm.clear()