Issue
As soon as I select a value from my dropdown this error appears
‘package: flutter/src/material/dropdown.dart/: Failed assertion: line 855 pos 15: ‘item == bull || item.isEmpty || value == null|| item.where((DropdownMenuItemitem){ retuen item.value == value;)}.length ==1’:There should be exactly one item with [DropdownButton]’s value: Category 1. Either zero or 2 or more [DropdownMenuItem]s were detected with the same value
How can I rectify it?
And here is my code. It would be a great help.
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
void main() {
runApp(MaterialApp(home: MyApp()));
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
String valueChoose;
List _listItem = ["Category 1", "Category 2", "Category 3", "Category 4"];
List _listItem1 = [
"Sub Category 1",
"Sub Category 2",
"Sub Category 3",
"Sub Category 4"
];
List _listItem2 = ["CRIS", "ADMINISTRATION", "ZONE", "DEPARTMENT"];
var selectedState;
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Feedback"),
centerTitle: true,
leading: IconButton(
onPressed: () {},
icon: Icon(Icons.home),
),
),
body: Container(
child: Center(
child: Form(
autovalidateMode: AutovalidateMode.onUserInteraction,
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text("Category"),
DropdownButton(
hint: Text("Select"),
items: _listItem
.map<DropdownMenuItem<String>>((valueItem) {
return DropdownMenuItem<String>(
value: valueItem,
child: Text(valueItem),
);
}).toList(),
onChanged: (selectedAccountType) {
setState(() {
selectedState = selectedAccountType;
});
},
value: selectedState,
)
],
),
SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text("SUBCATEGORY"),
DropdownButton(
hint: Text("Select"),
items: _listItem1
.map<DropdownMenuItem<String>>((valueItem1) {
return DropdownMenuItem<String>(
value: valueItem1,
child: Text(valueItem1),
);
}).toList(),
onChanged: (selectedAccountType) {
setState(() {
selectedState = selectedAccountType;
});
},
value: selectedState,
)
],
),
SizedBox(height: 10),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text("MARKED TO"),
DropdownButton(
hint: Text("Select"),
items: _listItem2
.map<DropdownMenuItem<String>>((valueItem2) {
return DropdownMenuItem<String>(
value: valueItem2,
child: Text(valueItem2),
);
}).toList(),
onChanged: (selectedAccountType) {
setState(() {
selectedState = selectedAccountType;
});
},
value: selectedState,
)
],
),
SizedBox(height: 10),
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: EdgeInsets.fromLTRB(70, 00, 70, 00),
child: TextField(
decoration: InputDecoration(
hintText: "Describe your problem here.",
),
maxLength: 1000,
maxLines: 5,
),
)
],
),
SizedBox(height: 10),
ButtonTheme(
child: ElevatedButton(
child: Text("Submit"),
onPressed: () {},
style: ElevatedButton.styleFrom(
padding: EdgeInsets.symmetric(
horizontal: 25, vertical: 15),
),
),
),
]),
),
),
));
}
}
Solution
The first problem is that you are using the selectedState variable for all DropdownMenu widget. And this isn’t practical and it could lead to unexpected behavior and bugs. You should define a separate variable for each DropdownMenu.
Another problem is the way you are initializing the selectedState variable.
You are doing this: var selectedState;, without specifying a value so it gets a value of null by default.
However, the initial value of the selectedState varibale has to be one of the options of the DropdownMenu.
For example if these List<String> options = <String>["Option 1", "Option 2", "Option 3", "Option 4"]; are your options for the DropdownMenu, then you would have to initialize the selectedState variable like this for example: var selectedState = "Option 1";.
And the error is gone!
Answered By – Andrej
Answer Checked By – Marilyn (FlutterFixes Volunteer)