skip to Main Content

This link here describes how to set an initial value to a TextField widget. I need to be able to set a value (possibly overriding any existing value) if a CheckboxListTile is checked, and clear the value if unchecked. How can I achieve this?

What I’ve tried: (Seems the question is pretty much solved with this update. Now, I want to know if assigning controller = TextEditingController(); and again in initState and later again in setState as controller = TextEditingController(text: "Default Value 01"); and controller = TextEditingController(text: ""); a good practice?)

class _MyHomePageState extends State<MyHomePage> {
  late TextEditingController controller;
  String text = "";

  @override
  void initState() {
    super.initState();
    controller = TextEditingController();
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  bool? _isChecked = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            TextField(
              controller: controller,
              onSubmitted: (String value) {
                setState(() {
                  text = controller.text;
                });
              },
            ),
            CheckboxListTile(
              value: _isChecked,
              controlAffinity: ListTileControlAffinity.leading,
              onChanged: (bool? newValue) {
                setState(() {
                  _isChecked = newValue;
                  if (_isChecked == true) {
                    //text = "Default Value 01";
                    controller =
                        TextEditingController(text: "Default Value 01");
                  }
                  if (_isChecked == false) {
                    //text = "";
                    controller = TextEditingController(text: "");
                  }
                });
              },
              title: Text("Checkbox"),
            ),
            const SizedBox(
              height: 20,
            ),
            Text(text),
          ],
        ),
      ),
    ));
  }
}

2

Answers


  1. To set a text to TextField use _controller.text = "<Your-Text>"

    Example

    bool _isChecked = false;
    
    CheckboxListTile(
              title: const Text('Example'),
              value: _isChecked,
              onChanged: (bool? value) {
                if(value is bool) {
                  setState(() {
                    _isChecked = value;
                  });
                  if(_isChecked) {
                    _controller.text = "<Your-Text>";
                  } else {
                    _controller.clear();
                  }
                }
              },
              secondary: const Icon(Icons.hourglass_empty),
            )
    
    Login or Signup to reply.
  2. You are initializing the controller again which is not recommended instead just change the value to text property of controller like this:

    TextField(
                  controller: controller,
                  onSubmitted: (String value) {
                    setState(() {
                      text = controller.text;
                    });
                  },
                ),
                CheckboxListTile(
                  value: _isChecked,
                  controlAffinity: ListTileControlAffinity.leading,
                  onChanged: (bool? newValue) {
                    setState(() {
                      _isChecked = newValue;
                      if (_isChecked == true) {
                        controller.text= "Default Value 01";
                      }
                      if (_isChecked == false) {
                        controller.text= ""; // or just run controller.clear();
                      }
                    });
                  },
                  title: Text("Checkbox"),
                ),
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search