Update value TextField using TextEditingController - flutter

Question

I want to update value in TextField but it become like this
And this my issue code
Widget build(BuildContext context) {
final certificatesData = Provider.of < Certificates > (context);
final cerData = certificatesData.certData;
if (cerData != null) {
print("test in");
inspectionTypeDis = cerData['inspectionType'];
_clientDataL = clientDis;
if (_clientDataL != null) {
getClientEmailL(_clientDataL);
}
}
if (emailClientDataL != null) {
_emailClientDataL = clientEmailDis;
}
return Form(
key: _formKey,
child: AlertDialog(
title: Container(
color: Color.fromARGB(255, 75, 185, 159),
child: Text('Edit',
textAlign: TextAlign.center, style: TextStyle(color: Color.fromARGB(255, 250, 251, 250))),
padding: const EdgeInsets.all(17),
margin: const EdgeInsets.all(0),
),
content: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: < Widget > [
SizedBox(
width: 630,
height: 100,
child: ListView(
shrinkWrap: true,
scrollDirection: Axis.horizontal,
children: < Widget > [
Container(
width: 310,
height: 20,
// color: Colors.purple[600],
child: ListTile(
title: Text('Inspection Type'),
subtitle: TextField(
controller: TextEditingController(text: inspectionTypeDis),
onChanged: (text) {
inspectionTypeDis = text;
},
decoration: const InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(4))),
),
),
),
),
),
]),
],
));
}
Detail Code
class EditCertificateInspection extends StatefulWidget with InputValidationMixin {
EditCertificateInspection({
Key key
}): super(key: key);
#override
_EditCertificateInspection createState() => _EditCertificateInspection();
}
class InputValidationMixin {}
class _EditCertificateInspection extends State < EditCertificateInspection > {
final navigatorKey = GlobalKey < NavigatorState > ();
final _formKey = GlobalKey < FormState > ();
Widget build(BuildContext context) {
final certificatesData = Provider.of < Certificates > (context);
final cerData = certificatesData.certData;
if (cerData != null) {
print("test in");
inspectionTypeDis = cerData['inspectionType'];
_clientDataL = clientDis;
if (_clientDataL != null) {
getClientEmailL(_clientDataL);
}
}
if (emailClientDataL != null) {
_emailClientDataL = clientEmailDis;
}
return Form(
key: _formKey,
child: AlertDialog(
title: Container(
color: Color.fromARGB(255, 75, 185, 159),
child: Text('Edit',
textAlign: TextAlign.center, style: TextStyle(color: Color.fromARGB(255, 250, 251, 250))),
padding: const EdgeInsets.all(17),
margin: const EdgeInsets.all(0),
),
content: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: < Widget > [
SizedBox(
width: 630,
height: 100,
child: ListView(
shrinkWrap: true,
scrollDirection: Axis.horizontal,
children: < Widget > [
Container(
width: 310,
height: 20,
child: ListTile(
title: Text('Inspection Type'),
subtitle: TextField(
controller: TextEditingController(text: inspectionTypeDis),
onChanged: (text) {
inspectionTypeDis = text;
},
decoration: const InputDecoration(
border: OutlineInputBorder(borderRadius: BorderRadius.all(Radius.circular(4))),
),
),
),
),
),
]),
],
));
},
}

Answer 1

I will suggest creating a state variable for TextEditingController for statefulwidget and to set the text. use
TextEditingController.fromValue(TextEditingValue(text: inspectionTypeDis));
Widget structure can be
final TextEditingController controller = TextEditingController();
#override
Widget build(BuildContext context) {
return Consumer<Certificates>(builder: (context, value, child) {
final cerData = value....;
if (cerData != null) {
// your logic
controller.text = "";
}
return TextFormField(
controller: controller,
);
});
}

Answer 2

What you could to is to change your TextField for a TextFormField with an initialValue.
TextFormField(
initialValue: cerData['inspectionType'],
onChanged: (text) {
inspectionTypeDis = text;
},
decoration: const InputDecoration(
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(4))),
),
EDIT
Here is a fully example using a StatefulWidget using the snippet I provide above.
class Test extends StatefulWidget {
const Test({Key? key}) : super(key: key);
#override
_TestState createState() => _TestState();
}
class _TestState extends State<Test> {
String _inspectionTypeDis = 'initialValue';
#override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
TextFormField(
initialValue: _inspectionTypeDis,
onChanged: (text) {
_inspectionTypeDis = text;
},
decoration: const InputDecoration(
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(4))),
),
),
TextButton(
child: const Text('Print value'),
onPressed: () => print(_inspectionTypeDis)),
],
),
);
}
}