Expected a value of type 'String', but got one of type 'Null' while data updation

Question

I have created CRUD operations in MySQL through flutter HTTp API. I can fetch data from mysql database. I would like to edit/update one of item. If i select any one item it will show a black field, after initstate() add & final variable declared the error is showing. I am confused.

This is main.dart fetch details:

ListTile(
              onTap: () {
                Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => new updateUsersData(
                            id: list[i]["ID"],
                            name: list[i]["NAME"],
                            mobile: list[i]["MOBILE"])));
              },
              title: Text(list[i]["NAME"]),
              subtitle: Text(list[i]['MOBILE']),
              leading: CircleAvatar(
                child: Text(
                    list[i]["NAME"].toString().substring(0, 1).toUpperCase()),
              ),
            ),

and this is update users code in dart

import 'package:flutter/material.dart';

import 'package:http/http.dart' as http;

class updateUsersData extends StatefulWidget {
  final String id;
  final String name;
  final String mobile;

  const updateUsersData(
      {Key? key, required this.id, required this.name, required this.mobile})
      : super(key: key);

  @override
  _updateUsersDataState createState() => _updateUsersDataState();
}

class _updateUsersDataState extends State<updateUsersData> {
  final txtName = TextEditingController();
  final txtMobile = TextEditingController();
  bool _valname = false;
  bool _valmobile = false;
  @override
  void dispose() {
    txtName.dispose();
    txtMobile.dispose();
    super.dispose();
  }

  @override
  void initState() {
    txtName.text = widget.name;
    txtMobile.text = widget.mobile;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Update User Data"),
      ),
      body: Container(
        padding: EdgeInsets.all(30.0),
        child: Column(
          children: [
            TextField(
              controller: txtName,
              decoration: InputDecoration(
                  hintText: "Enter Your Name",
                  label: Text("Name"),
                  errorText: _valname ? "Name Cannot be Empty" : null),
            ),
            TextField(
              controller: txtMobile,
              decoration: InputDecoration(
                  hintText: "Enter Your Mobile",
                  label: Text("Mobile"),
                  errorText: _valmobile ? "Mobile Cannt be Empty" : null),
            ),
            ButtonBar(
              children: [
                ElevatedButton(
                  onPressed: () {
                    setState(() {
                      txtName.text.isEmpty ? _valname = true : _valname = false;
                      txtMobile.text.isEmpty
                          ? _valmobile = true
                          : _valmobile = false;
                      if (_valname == false && _valmobile == false) {
                        //_savedetail(txtName.text, txtMobile.text);
                      }
                    });
                  },
                  child: Text("Update Data"),
                  style: ElevatedButton.styleFrom(primary: Colors.green),
                ),
                ElevatedButton(
                  onPressed: () {
                    txtMobile.clear();
                    txtName.clear();
                  },
                  child: Text("Delete Data"),
                  style: ElevatedButton.styleFrom(
                    primary: Colors.red,
                  ),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}

the error is after final variable declared

enter image description here

Please help me how to get selected values from fetched data

Answer 1

I can see that your implementation of class updateUsersData extends StatefulWidget requires 3 required properties of type String. And in the following code:

sersData(
    id: list[i]["ID"],
    name: list[i]["NAME"],
    mobile: list[i]["MOBILE"])));

You are reading the values at index i with the keys of ID, NAME and MOBILE.

Your issue is without a doubt inside either one or more of those keys' values. The values of those keys are not String, one or some or all of them!

If I were you, I would put a breakpoint in this line:

const updateUsersData

... the constructor of your class, and check the incoming values.

Another point for you is that Dart classes need to be Upper Camel Case as documented here so you should ideally rename your updateUsersData class to UpdateUsersData instead.