How to change data in fire store using button in flutter?

Question

here I have code for my report page which got data from the firebase. As I am new in flutter and coding in general, I would like to ask a question on how I can update the status data in my firebase from 0 = pending to 1 = accepted, 2 = rejected and redirect the data inside the detail page state into another page by using button.

 class Report extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  return Scaffold(
  appBar: AppBar(
    title: Text('Report'),
  ),
  backgroundColor: Colors.blue,
  body: ListPage(),
);
}
}

class ListPage extends StatefulWidget {
@override
_ListPageState createState() => _ListPageState();
}

class _ListPageState extends State<ListPage> {

Future getPosts() async{
var firestore = Firestore.instance;
QuerySnapshot qn = await firestore.collection("report").getDocuments();

return qn.documents;
}

navigateToDetail(DocumentSnapshot post){
Navigator.push(context, MaterialPageRoute(builder: (context) => DetailPage(post: post)));
}

@override
Widget build(BuildContext context) {
return Container(
  child: FutureBuilder(
    future: getPosts(),
    builder: (_, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting){
      return Center(child: Text("Loading..."),  
      );
      
    }else{

     return ListView.builder(
     itemCount: snapshot.data.length,
     itemBuilder: (_, index) {
     return Card(
     child: ListTile(
     title: Text(snapshot.data[index].data["name"]),
     onTap: () => navigateToDetail(snapshot.data[index]),
          )
          );
      });
     }
    }),
   );
  }  
}

  class DetailPage extends StatefulWidget {

  final DocumentSnapshot post;
  DetailPage({this.post});

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

 updateData() async {
 CollectionReference collectionReference = Firestore.instance.collection('report');
 QuerySnapshot querySnapshot = await collectionReference.getDocuments();
 querySnapshot.documents[0].reference.updateData({"status":"0"});
}

 class _DetailPageState extends State<DetailPage> {
 @override
 Widget build(BuildContext context) {
  return Card(
   child: Column(
    children: <Widget>[
      SizedBox(height: 100,),
      Text("Name:" ' ' + widget.post.data["name"]),
      Text("Note:" ' ' + widget.post.data["note"]),
      Text("Type:" ' ' + widget.post.data["type"]),
      Image.network(widget.post.data["picture"]),
      
      RaisedButton(
        child: Text("Approve"),
        onPressed: () {
          Navigator.of(context).pushNamed('/approved');
        },
        color: Colors.green,
        ),
      RaisedButton(
        child: Text("Reject"),
        onPressed: () {
          Navigator.of(context).pushNamed('/rejected');
        },
        color: Colors.red,
        ),
     ],
   ),
  );
}
}

score 0 · Accepted Answer · answered Nov 12 '20 at 09:20

Flutter is a declarative framework, this means your UI reacts to state follow this link for more info. So you could create a boolean statusRequest, set it to false initially then onTap() => add an event , you would then manage this event (button click) using a BLoc which maps events like the button press to a state change. Given you are new to flutter I suggest you watch this video about BLoc understand it, then continue with your above project.

How to change data in fire store using button in flutter?

1 Answers1

Linked