TextFormField losing value when changing focus

Question

I am trying to move to other TextFormField but whenever I lose focus from first TextFormField text became empty, I search about this issue but I don't find any solution till now.

  var _formKey = GlobalKey<FormState>();
  Note note;

  TextEditingController titleController=TextEditingController();
  TextEditingController descriptionController=TextEditingController();

  @override
  Widget build(BuildContext context) {
    TextStyle textStyle=Theme.of(context).textTheme.title;

    titleController.text=note.title;
    descriptionController.text=note.description;

    // TODO: implement build
    return WillPopScope(    
      onWillPop: (){    
        moveToLastScreen();
      },
        child:Scaffold(
      appBar: AppBar(
        title: Text("appBarTitle"),
        leading: IconButton(icon:Icon(Icons.arrow_back),onPressed: (){   
          moveToLastScreen();
        },),
      ),
      body: Form(
          key: _formKey,
          child: Padding(
          padding: EdgeInsets.only(top: 15.0,left: 15.0,right: 10.0),
          child: ListView(
            children: <Widget>[
              //1st element
              Padding(
                padding: EdgeInsets.only(top: 15.0,bottom: 15.0,),
                child: TextFormField(
                  validator: (String value){ 
                    if(value.isEmpty)
                    {
                      return "Please enter Title";
                    }
                  },
                  controller: titleController,
                  style: textStyle,
                  onSaved: (value){
                    debugPrint("Something changed in title Text field");
                    updateTitle();
                  },
                  /*onChanged: (value){
                    debugPrint("Something changed in title Text field");
                    updateTitle();
                  },*/
                  decoration: InputDecoration(
                    labelText: "Title",
                    labelStyle: textStyle,
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(5.0)
                    )
                  ),
                ),

              ),

              //2nd element
              Padding(
                padding: EdgeInsets.only(top: 15.0,bottom: 15.0,),
                child: TextFormField(
                  validator: (String value){  //2nd step for form with validation
                    if(value.isEmpty)
                    {
                      return "Please enter principle amount";
                    }
                  },
                  onSaved: (value){
                    debugPrint("Something changed in Description Text field");
                    updateDescription();
                  },
                  controller: descriptionController,
                  style: textStyle,
                  /*onChanged: (value){
                    debugPrint("Something changed in Description Text field");
                    updateDescription();
                  },*/
                  decoration: InputDecoration(
                      labelText: "Description",
                      labelStyle: textStyle,
                      border: OutlineInputBorder(
                          borderRadius: BorderRadius.circular(5.0)
                      )
                  ),
                ),

              ),

              //3th element
              Padding(
                padding: EdgeInsets.only(top: 15.0,bottom: 15.0),
                child: Row(
                  children: <Widget>[
                    Expanded(
                      child: RaisedButton(
                        color: Theme.of(context).primaryColorDark,
                          textColor: Theme.of(context).primaryColorLight,
                          child: Text("Save",textScaleFactor: 1.5,),
                          onPressed: (){
                          setState(() {
                            if(_formKey.currentState.validate()) {
                              debugPrint("Save Pressed");
                              _save();
                            }
                          });
                          }
                      ),
                    ),

                    Container(width: 5.0,),

                    Expanded(
                      child: RaisedButton(
                          color: Theme.of(context).primaryColorDark,
                          textColor: Theme.of(context).primaryColorLight,
                          child: Text("Delete",textScaleFactor: 1.5,),
                          onPressed: (){
                            setState(() {
                              debugPrint("Delete Pressed");
                              _delete();
                            });
                          }
                      ),
                    ),
                  ],
                ),
              ),

            ],
          ),
      )),

    ));
  }

Please suggest me I am new in flutter.

Answer 1

Remove titleController.text=note.title; descriptionController.text=note.description; from your build method and place it in initState method.

You will lose the value in the textField because those lines get executed anytime there is a rebuild, thereby replacing the values gotten from the textFields and replacing it with note.title and note.description which are empty at that point.

In other words, remove those lines and add this to your code.

@override
  void initState() {
    super.initState();
    titleController.text=note.title; 
    descriptionController.text=note.description;
  }