Question 75868 in Flutter Question posted in
The official Flutter documentation can be found here.

Provider clears Text in Textfield after a function is called – Flutter

I am using provider to show if there is an error in textfield.

if the text in textfield is empty then it shows 'error' as errorText else it will show nothing,

Here’s my code:

  class TextFieldPage extends StatelessWidget {
  const TextFieldPage({super.key});

  @override
  Widget build(BuildContext context) {
    final provider = Provider.of<TextFieldProvider__>(context);
    TextEditingController _controller = TextEditingController();

    return Scaffold(
        body: Column(children: [
      Consumer<TextFieldProvider__>(
        builder: (context, value, child) {
          return TextField(
            controller: _controller,
            decoration: InputDecoration(errorText: value.errorText),
          );
        },
      ),
      ElevatedButton(
          onPressed: () {
            if (_controller.text == "") {
              provider.changeErrorText('error');
            } else {
              provider.changeErrorText('');
            }
          },
          child: Text("press"))
    ]));
  }
}


class TextFieldProvider__ extends ChangeNotifier {
  String _errorText = '';

  String get errorText => _errorText;

  changeErrorText(String text) {
    _errorText = text;
    notifyListeners();
  }
}

The problem is when I click the button it calls ChangeErrorText() and removes the text in TextField.
How do I avoid it?

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    The problem was that I forgot to set listen: false while creating an instance of provider.

    It should be:

    final provider = Provider.of<TextFieldProvider__>(context,listen: false);

    Not This:

    final provider = Provider.of<TextFieldProvider__>(context);

    this was rebuilding the widget and text in TextField was been cleared.


  2. 0

    replace your _controller

    incorrect

    class Class {

Widget build..{
TextEditingController _controller = TextEditingController()
 return ...
}

    correct

    class Class {
TextEditingController _controller = TextEditingController()

Widget build..{}
    Login or Signup to reply.
  3. 0

    Your EditFieldPage should be as StatefulWidget and _controller should be as property of _TextFieldPageState

    class TextFieldPage extends StatefulWidget {
  const TextFieldPage({super.key});

  @override
  State<TextFieldPage> createState() => _TextFieldPageState();
}

class _TextFieldPageState extends State<TextFieldPage> {
  final TextEditingController _controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    final provider = Provider.of<TextFieldProvider__>(context);

    return Scaffold(
        body: Column(children: [
      Consumer<TextFieldProvider__>(
        builder: (context, value, child) {
          return TextField(
            controller: _controller,
            decoration: InputDecoration(errorText: value.errorText),
          );
        },
      ),
      ElevatedButton(
          onPressed: () {
            if (_controller.text == "") {
              provider.changeErrorText('error');
            } else {
              provider.changeErrorText('');
            }
          },
          child: Text("press"))
    ]));
  }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search