Pass data from one widget to another in a Form in Flutter

Question

https://flutter.dev/docs/cookbook/forms/validation

Here they have used two widgets in a Form : TextFormWidget and ElevatedButton . They say that TextFormWidget 's validator receives the value input by the user.

I want to print that value when the user pressed the ElevatedButton .

How do I make ElevatedButton receive that value from TextFormWidget ?

@override
  Widget build(BuildContext context) 
  {
    return Form(
      key: _formKey,
      child: Column(
        children: <Widget>[
                   TextFormField(
                        // The validator receives the text that the user has entered.
                        validator: (value) 
                        {
                           if (value == null || value.isEmpty) 
                           {
                               return 'Please enter some text';
                           }
                           return null;
                        },
                    ),


                   ElevatedButton(
                       onPressed: () {
                          if (_formKey.currentState!.validate()) {
                             ....
                          }
                       },
                       child: Text('Submit'),
                   ),
              ],
      ),
    );
  }

Answer 1

Set the controller property of your TextFormField and read the data from there.

Use it as follows:

var controller = TextEditingController();

@override
  Widget build(BuildContext context)
  {
    return Form(
      key: GlobalKey(),
      child: Column(
        children: <Widget>[
          TextFormField(
            controller: controller,
            // The validator receives the text that the user has entered.
            validator: (value)
            {
              if (value == null || value.isEmpty)
              {
                return 'Please enter some text';
              }
              return null;
            },
          ),


          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState!.validate()) {
              String currentText = controller.text;
              // ...do something with currentText
            }
            },
            child: Text('Submit'),
          ),
        ],
      ),
    );
  }

Answer 2

You can use a TextEditingController and pass it in the controller argument of the TextFormField . From the controller you can get the value or the input given by the use.

Example

  // Controller
  final TextEditingController _controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: <Widget>[
          TextFormField(
            // Add the controller to the TextFormField
            controller: _controller,
            // The validator receives the text that the user has entered.
            validator: (value) {
              if (value == null || value.isEmpty) {
                return 'Please enter some text';
              }
              return null;
            },
          ),
          ElevatedButton(
            onPressed: () {
              // if (_formKey.currentState!.validate()) {
              //    ....
              // }

              // This gives the value
              final String value = _controller.text;
              print(value);
            },
            child: Text('Submit'),
          ),
        ],
      ),
    );
  }