'Get value from textFormField within a ListView
I've a ListView in my flutter project, in which I have 2 TextFormFields. I want the get the value whatever user has typed in from the TextFormField and print it(for now).
I've checked following link - Flutter : Textfield in ListView.builder and tried to get the value.
Following is my code -
class _OrderBookingState extends State<OrderBooking> {
@override
Widget build(BuildContext context) {
TextEditingController controller = new TextEditingController();
List<TextEditingController> _textFieldRateControllers = new List();
List<TextEditingController> _textFieldQtyControllers = new List();
return Scaffold(
appBar: AppBar(
title: Center(child: Text(widget.shop.shopName)),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
child: StreamBuilder<List<ProductModel>>(
stream: DatabaseService().productList,
builder: (context,snapshot){
if(snapshot.hasData){
return Flexible(
child: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: snapshot.data.length,
itemBuilder: (context, index){
_textFieldRateControllers[index].text = "5";
_textFieldQtyControllers[index].text = "5";
_textFieldQtyControllers.add(new TextEditingController());
_textFieldRateControllers.add(new TextEditingController());
return Padding(
padding: EdgeInsets.only(top: 8.0),
child: Card(
margin: EdgeInsets.fromLTRB(10.0, 6.0, 10.0, 0.0),
child: ListTile(
leading: CircleAvatar(
radius: 25.0,
backgroundColor: Colors.deepOrangeAccent,
),
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Container(
width: 175,
child: Text(snapshot.data[index].productName,),
),
// Expanded(child: Container(
// width: 10,
// child: Center(child: Text(snapshot.data[index].productName,)))),
SizedBox(width: 5,),
Expanded(child: Container(
width: 10,
child: TextFormField(
controller: _textFieldRateControllers[index],
initialValue: snapshot.data[index].rate,textAlign: TextAlign.center,
),
),
),
SizedBox(width: 5,),
Expanded(child: TextFormField(
controller: _textFieldQtyControllers[index],
initialValue: "0",textAlign: TextAlign.center,)
)
],
),
subtitle: Text('MRP ' + snapshot.data[index].mrp),
),
),
);
}
),
);
}else{
return Loading();
}
}
),
),
Container(
margin: EdgeInsets.fromLTRB(10.0, 6.0, 10.0, 0.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"Total Value: 0/-",
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold,backgroundColor: Colors.greenAccent)
),
RaisedButton(
child: Text("Save",style: TextStyle(fontSize: 18.0),),
color: Colors.green,
textColor: Colors.white,
highlightColor: Colors.lightGreenAccent,
onPressed: (){
print(_textFieldQtyControllers[1].text);
},
)
],
),
)
],
),
);
}
}
I'm getting below error -
RangeError (index): Invalid value: Valid value range is empty: 0
Please let me know how to solve this.
Solution 1:[1]
NEW UPDATE
You need to the remove the initalValue argument from the TextField:
Expanded(child: TextFormField(
controller: _textFieldQtyControllers[index],
initialValue: "0", //REMOVE THIS LINE
textAlign: TextAlign.center,)
)
And you have the wrong order of actions, it must be:
- Set add the TextEditingController to your list with
_textFieldRateControllers.add(new TextEditingController());
_textFieldQtyControllers.add(new TextEditingController());
- Set the controller text to your initialValue:
_textFieldRateControllers[index].text = snapshot.data[index].rate.toString();
_textFieldQtyControllers[index].text = "0";
OLD
To solve your error, remove the initialValue and instead set the
//set this after
_textFieldRateControllers[index].text = //your Initial data
_textFieldQtyControllers[index].text = //your Initial data
I think you did not set the List properly, as a TextEditingController needs to be created like this:
TextEditingController controller = new TextEditingController();
So then in your ListView, call this in the builder:
_textFieldRateControllers.add(new TextEditingController());
_textFieldQtyControllers.add(new TextEditingController());
This creates the controller properly with a constructor
Solution 2:[2]
late List<TextEditingController> txtDataNascDogs;
late List<FocusNode> _dataNascFocuss;
@override
void initState() {
txtDataNascDogs = List<TextEditingController>.generate(
Get.find<AgendamentoVacinaController>().listDogMenorIdade.length,
(index) => TextEditingController(text: ""));
_dataNascFocuss = List<FocusNode>.generate(
Get.find<AgendamentoVacinaController>().listDogMenorIdade.length,
(index) => FocusNode());
super.initState();
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | |
Solution 2 | Rodrigossff91 |