How to create a Dropdown in Flutter from Firebase to save Document ID

Question

I'm trying to create a Dropdown from Firestore in Flutter. So this is what I have:

So what I would like to do is to have a Select Dropdown or even a Search Box which displays the field nombre from the document and depending on the selected name save the Document ID into a Variable.

Basically the Dropdown should show as Lable's the Nombre and save the DocumentID if it could be a combination of both (Searchable Dropdown) would be even better.

Any Ideas?

Kind Regards.

Answer 1

This question has already been answered in the past.

    new StreamBuilder<QuerySnapshot>(
        stream: Firestore.instance.collection('categories').snapshots(),
        builder: (context, snapshot){
          if (!snapshot.hasData) return const Center(
            child: const CupertinoActivityIndicator(),
          );
          var length = snapshot.data.documents.length;
          DocumentSnapshot ds = snapshot.data.documents[length - 1];
          _queryCat = snapshot.data.documents;
          return new Container(
            padding: EdgeInsets.only(bottom: 16.0),
            width: screenSize.width*0.9,
            child: new Row(
              children: <Widget>[
                new Expanded(
                    flex: 2,
                    child: new Container(
                      padding: EdgeInsets.fromLTRB(12.0,10.0,10.0,10.0),
                      child: new Text("Category",style: textStyleBlueBold,),
                    )
                ),
                new Expanded(
                  flex: 4,
                  child:new InputDecorator(
                    decoration: const InputDecoration(
                      //labelText: 'Activity',
                      hintText: 'Choose an category',
                      hintStyle: TextStyle(
                        color: primaryColor,
                        fontSize: 16.0,
                        fontFamily: "OpenSans",
                        fontWeight: FontWeight.normal,
                      ),
                    ),
                    isEmpty: _category == null,
                    child: new DropdownButton(
                      value: _category,
                      isDense: true,
                      onChanged: (String newValue) {
                        setState(() {
                          _category = newValue;
                          dropDown = false;
                          print(_category);
                        });
                      },
                      items: snapshot.data.documents.map((DocumentSnapshot document) {
                        return new DropdownMenuItem<String>(
                            value: document.data['title'],
                            child: new Container(
                              decoration: new BoxDecoration(
                                  color: primaryColor,
                                  borderRadius: new BorderRadius.circular(5.0)
                              ),
                              height: 100.0,
                              padding: EdgeInsets.fromLTRB(10.0, 2.0, 10.0, 0.0),
                              //color: primaryColor,
                              child: new Text(document.data['title'],style: textStyle),
                            )
                        );
                      }).toList(),
                    ),
                  ),
                ),
              ],
            ),
          );
        }
    );

Souce: How to bind a Firestore documents list to a Dropdown menu in Flutter?