Store textfield value in Map value - flutter

Question

so i have this map of questions and have a textfield widget and i'm using a for loop to go through the questions and display them.
id love to store the textfield data in the right place in the map (something like: question 1 => answer 1 and so on)
here's the code:
import 'package:flutter/material.dart';
class CustomQuestionField extends StatefulWidget {
#override
State<CustomQuestionField> createState() => _CustomQuestionFieldState();
}
class _CustomQuestionFieldState extends State<CustomQuestionField> {
final Map<String, String> qna = {
"Everyone should read...": "",
"Two truths and a lie...": "",
"I can quote every line from...": "",
"If I didn't have to work I would...": "",
"People think I am...": "",
"Never have I ever...": "",
"Believe it or not, I...": "",
"I am amazing at...": "",
"My life as a movie...": "",
"My ultimate dinner party guest list...": "",
"The dorkiest thing about me is...": "",
"On the weekend you'll find me...": "",
};
#override
Widget build(
BuildContext context,
) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
for (var q in qna.keys) question(q),
RaisedButton(
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
color: Colors.purple,
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Text(
"Submit",
style: TextStyle(color: Colors.white, fontSize: 20),
),
),
onPressed: () {
print(qna.values);
}),
],
);
}
Widget question(String question) {
final myController = TextEditingController();
return Padding(
padding: const EdgeInsets.only(top: 15),
child: Stack(
children: [
Card(
elevation: 0,
shape: RoundedRectangleBorder(
side: BorderSide(width: 0.5, color: Colors.black),
borderRadius: BorderRadius.circular(
32,
)),
child: Padding(
padding: const EdgeInsets.all(20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.only(bottom: 15, left: 10),
child: Text(
question,
style: TextStyle(
color: Colors.black,
fontSize: 18.0,
fontWeight: FontWeight.bold),
),
),
TextField(
onChanged: ((value) {
print(value);
}),
onSubmitted: (String ansr) {
setState(() {
});
},
controller: myController,
decoration: InputDecoration(
// filled: true,
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: Color.fromARGB(255, 128, 124, 124),
),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: Color.fromARGB(255, 128, 124, 124),
),
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: Color.fromARGB(255, 128, 124, 124),
),
),
),
),
],
),
),
),
Positioned(
top: -10,
right: -25,
child: RawMaterialButton(
onPressed: () {},
elevation: 2.0,
fillColor: Colors.white,
child: Text(
"X",
style:
TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
),
shape: CircleBorder(),
),
),
],
),
);
}
}
here's a screenshot:
any ideas on how to do it?

Answer 1

just create a map to contain the answers:
final Map<String, String> answers = {};
then in your onSubmitted, add this line:
answers[question] = ansr;

Answer 2

You does not defined key in map, convert your map into this
final Map<String, String> qna = [
{"question" : "Everyone should read...", "answer":""},
{"question" :"Two truths and a lie...", "answer":""},
{"question" :"I can quote every line from...", "answer":""},
.
.
.
{"question" :"On the weekend you'll find me...", "answer":""},
];
**In Text Field setState**
TextField(
onChanged: ((value) {
print(value);
}),
onSubmitted: (String ansr) {
setState(() {
q[answer]=ansr;
});
},
--------------------------------------
RaisedButton(
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
color: Colors.purple,
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Text(
"Submit",
style: TextStyle(color: Colors.white, fontSize: 20),
),
),
onPressed: () {
print(qna["answer"]);
}),