lundi 3 mai 2021

How To Make Checkbox dynamically Flutter from database Mysql?

I want to make checkbox flutter dynamically which retrieve data from database mysql. So, this code can display data from mysql. But still can't check one by one. this my code :

class TambahDataTanaman extends StatefulWidget {
  @override
  _TambahDataTanamanState createState() => _TambahDataTanamanState();
}
 
class _TambahDataTanamanState extends State<TambahDataTanaman> {
  GlobalKey<FormState> addTanamanKey = GlobalKey<FormState>();
   
  Future<List> getData() async {
    final response =
        await http.get("http://192.168.1.9/tanampedia/tanahtampil.php");
    return json.decode(response.body);
  }
 
  
  @override
 
 
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Tambah Data Tanaman"),
          backgroundColor: Colors.green,
        ),
        body: SingleChildScrollView(
          child: Form(
            key: addTanamanKey,
            child: Padding(
              padding: const EdgeInsets.all(10.0),
              child: ListView(
                shrinkWrap: true,
                children: [
                  new Column(
                    children: [
                     
                      new FutureBuilder<dynamic>(
                          future: getData(),
                          builder: (context, snapshot) {
                            if (snapshot.hasError) print(snapshot.error);
                            return snapshot.hasData
                                ? ListView.builder(
                                    shrinkWrap: true,
                                    itemCount: snapshot.data.length,
                                    itemBuilder: (context, index) {
                                      //List list = snapshot.data;
                                      bool isSelected = false;
                                      return CheckboxListTile(
                                        title:
                                            Text(snapshot.data[index]['nama']),
                                        value: isSelected,
                                        //selected: selected,
                                        //key: Key(snapshot.data[index]['id']),
                                        onChanged: (value) {
                                          setState(() {
                                            isSelected = value;
                                          });
                                        },
                                        dense: true,
                                      );
                                    })
                                : new Center(
                                    child: new CircularProgressIndicator());
                          }),
 
                      new RaisedButton(
                          child: new Text(
                            "Tambah Data",
                            style: TextStyle(color: Colors.white),
                          ),
                          color: Colors.green,
                          onPressed: () {}),
                    ],
                  ),
                ],
              ),
            ),
          ),
        ));
  }
}

I use future builder to make list for my checkboxlist. But when running the code, The result of the code above is that all values ​​are checked at the same time and then stuck yellow line in line circular progress enter image description here , so how to make them correct?




Aucun commentaire:

Enregistrer un commentaire