Flutter:Array of Textformfield validator not working

Question

I am working on an Array of Textformfields. The Array can be more than 50. I want to submit array of values to the server. The issue is when I execute validator it will be validating the first 8 in the array after that no error message. That too disappears when scrolling. I posted my code below:

void validateAndSave() {
    final form = _formKey.currentState;
    if (form.validate()) {

      _formKey.currentState.save();
      print('Form is valid');
    }
    else {
    //  _formKey.currentState.
      print('form is invalid');
    }

  }

    Widget singleItemList(int index) {
    Item item = itemList[index];

    return Container(
      width: MediaQuery.of(context).size.width,
      decoration: BoxDecoration(
        color: Colors.white,
      ),
      child:
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [






          Expanded(

            child:Padding(
              padding: const EdgeInsets.fromLTRB(20, 10, 10, 20),


              child: new TextFormField(
               controller: _controller[index],

              keyboardType: TextInputType.number,




                //onSubmitted: (text) {
              //  takeNumber(text, item.id);
              //},


                validator: (value) {
                  if (value.isEmpty) return 'value is required';

                },



                decoration: new InputDecoration(

                  border: new OutlineInputBorder(
                      borderSide: new BorderSide(color: Colors.indigo)),




                  labelText: itemList[index].id,

                  suffixStyle: const TextStyle(color: Colors.red)
              ),


              ),
            ),
          ),


        ],
      ),


    );

  }

Please help me. Thanks in advance.

Regards, Sathish

Answer 1

Have you considered replacing ListView.builder with Column?
Like this:

child: SingleChildScrollView(
    child: Column(
      children: List.generate(itemList.length, (index) {
        if (itemList.isEmpty) {
          return CircularProgressIndicator();
        } else {
          return singleItemList(index);
        }
      })
    ) 
  )

From ListView documentation :

Destruction
A new child at the same position in the list will be lazily recreated along with new elements, states and render objects when it is scrolled back.