I have a flutter app whereby I capture data using a textformfield in a screen. I have a second screen where I would like to display the data that I have captured from the text form field in the first screen.
But first I want to print it to the terminal, from the Second Screen controller, and see what has been passed. I have tried using using GetX naviagtion and passing but I get this error
The method '[]' was called on null.
Receiver: null
Tried calling: [](0)
This is the text form field I use to get data as input
TextFormField(
controller: controller._phoneNumberController,
keyboardType: TextInputType.text,
validator: (value) => validatePhoneNumber(value!),
style: TextStyle(
color: accentColor,
fontSize: 15,
fontFamily: 'PoppinsRegular',
),
decoration: InputDecoration(
hintText: "Phone Number",
hintStyle: TextStyle(
fontSize: 14,
color: Colors.black45,
fontWeight: FontWeight.w500),
fillColor: Color(0xffEBEDF4),
filled: true,
border: InputBorder.none,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xff1D275C),
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: formFieldColor,
width: 2.0,
),
),
),
),
This is the method I use to send data to the next page
GestureDetector(
onTap: () {
Get.to(SecondPage(), arguments: [
controller._phoneNumberController.text
]);
},
child: Container(
height: 40,
width: double.infinity,
decoration: BoxDecoration(
color: Color(0xffEF5E41),
),
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding:
const EdgeInsets.only(right: 130),
child: Text(
"Proceed",
style: TextStyle(
color: Color(0xffFCFCFC),
fontSize: 14,
fontWeight: FontWeight.w500,
),
),
),
Padding(
padding:
const EdgeInsets.only(right: 16),
child: Icon(
Icons.arrow_forward_ios,
color: Color(0xffFCFCFC),
),
)
],
),
),
),
),
This is where I try to print the data sent from the first page
dynamic argumentData = Get.arguments;
@override
void onInit() {
print(argumentData[0]);
super.onInit();
}
How can I fix this
I know you have an accepted answer here but just want to chime in with a different and arguably easier way that doesn't involve passing arguments around or keys.
Any TextEditingController
that lives in a GetX class is accessible from anywhere.
Add a listener and store that value into a variable.
class Controller extends GetxController {
final textController = TextEditingController();
RxString controllerText = ''.obs;
@override
void onInit() {
super.onInit();
textController.addListener(() {
controllerText.value = textController.text;
});
}
}
You can test this with a couple simple pages.
class Page1 extends StatelessWidget {
static const id = '/page1';
final controller = Get.put(Controller());
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
TextField(controller: controller.textController),
ElevatedButton(
onPressed: () => Get.toNamed(Page2.id),
child: Text('Go to page 2'),
),
],
),
),
);
}
}
class Page2 extends StatelessWidget {
static const id = '/page2';
@override
Widget build(BuildContext context) {
final controller = Get.find<Controller>();
return Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Center(
// Obx technically isn't needed for this example because
// Page2 builds after the value is updated
child: Obx(
() => Text(controller.controllerText
.value),
),
),
ElevatedButton(
onPressed: () => Get.back(),
child: Text('Go to page 1'),
),
],
),
);
}
}