Deleting Item from Dropdown in Flutter results in error - flutter

Question

I implemented a DropDown which contains a list of items you can delete.
The Dropdown can't be displayed correctly after deleting the item and that causes the error but i don't know how to fix this. Help is highly appriciated!
The DropDown:
The items are a collection of documents queried from firebase.
Deleting the item removes it from firebase but i get the following error:
This is my code:
var selectedStand;
void deleteStand() {
DocumentReference ref = Firestore.instance
.collection('Standnamen')
.document(selectedStand);
ref.delete();
}
StreamBuilder<QuerySnapshot>(
stream: Firestore.instance.collection('Standnamen').snapshots(),
// ignore: missing_return
builder: (context, snapshot) {
if (!snapshot.hasData) {
Text("Loading");
} else {
List<DropdownMenuItem> standItems = [];
for (int i = 0; i < snapshot.data.documents.length; i++) {
DocumentSnapshot snap = snapshot.data.documents[i];
standItems.add(
DropdownMenuItem(
child: Text(
snap.documentID,
style: TextStyle(color: Colors.blue),
),
value: "${snap.documentID}",
)
);
}
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
DropdownButton(
items: standItems,
onChanged: (standValue) {
setState(() {
selectedStand = standValue;
});
},
value: selectedStand,
isExpanded: false,
hint: new Text(
"Choose stand to delete",
),
),
)
],
);
}
},
),
],
),
);
}
}
Detailed Error:
════════ Exception caught by widgets library ═══════════════════════════════════════════════════════
The following assertion was thrown building StreamBuilder<QuerySnapshot>(dirty, state: _StreamBuilderBaseState<QuerySnapshot, AsyncSnapshot<QuerySnapshot>>#46c06):
There should be exactly one item with [DropdownButton]'s value: example3.
Either zero or 2 or more [DropdownMenuItem]s were detected with the same value
'package:flutter/src/material/dropdown.dart':
Failed assertion: line 827 pos 15: 'items == null || items.isEmpty || value == null ||
items.where((DropdownMenuItem<T> item) {
return item.value == value;
}).length == 1'
The relevant error-causing widget was:
StreamBuilder<QuerySnapshot> file:///Users/darjusch/Developer/flutterProjects/sommerobst_app_beta/lib/screens/admin/admin_create_stand_screen.dart:67:13
When the exception was thrown, this was the stack:
#2 new DropdownButton (package:flutter/src/material/dropdown.dart:827:15)
#3 _AdminCreateStandScreenState.build.<anonymous closure> (package:sommerobst_app_beta/screens/admin/admin_create_stand_screen.dart:92:23)
#4 StreamBuilder.build (package:flutter/src/widgets/async.dart:509:81)
#5 _StreamBuilderBaseState.build (package:flutter/src/widgets/async.dart:127:48)
#6 StatefulElement.build (package:flutter/src/widgets/framework.dart:4619:28)
...
════════════════════════════════════════════════════════════════════════════════════════════════════
W/erobst_app_bet(20965): Reducing the number of considered missed Gc histogram windows from 119 to 100
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
A RenderFlex overflowed by 99569 pixels on the bottom.
EDIT:
I tried your suggestion which sounds very logical but it did not work i still get the same error.
var selectedDoc;
DropdownButton(
items: standItems,
onChanged: (standValue) {
setState(() {
selectedStand = standValue;
selectedDoc = snapshot.data.documents.firstWhere(
(doc) => doc.documentID == selectedStand,
orElse: () => null,
);
});
},
value: selectedDoc?.documentID,

Answer 1

After deletion DropdownButton is given a value(selectedStand) that none of the DropdownMenuItems contain. So, first check if a document exists whose id is selectedStand otherwise set value to null.
// get the document with id as selectedStand. Will be null if it doesn't exist.
var selectedDoc = snapshot.data.documents.firstWhere(
(doc) => doc.documentID == selectedStand,
orElse: () => null,
);
DropdownButton(
// assign selectedDoc's id (same as selectedStand) if exists
// otherwise null
value = selectedDoc?.documentID,
// ...
),
The logic should not be in onChanged but outside of DropdownButton within the StreamBuilder.
selectedDoc = snapshot.data.documents.firstWhere(
(doc) => doc.documentID == selectedStand,
orElse: () => null,
);
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
DropdownButton(
items: standItems,
onChanged: (standValue) {
setState(() {
selectedStand = standValue;
});
},
value: selectedDoc?.documentID,
isExpanded: false,
hint: new Text(
"Choose stand to delete"
),
),
],
),
Alternatively you could set selectedStand = selectedDoc?.documentID right after finding selectedDoc, so that selectedStand will always have a valid value.

Answer 2

I guess the problem is that you are adding to the same variable without clearing it first which cause multiple element of items to be there with the same names. So I would suggest clear out the items in standItems right before you call the add function to add items outside the for loop.