I have DataTable in flutter, which is dynamically created. I have one column which is filled with dropdown buttons, I am facing this out of Range Error.
Here is the code
List<String> _values = [
"m\u00b3",
"ft\u00b3",
"cm\u00b3",
"m\u00b2",
"ft\u00b2",
"cm\u00b2",
"kg",
"lb",
"ton",
"No\'s",
];
List<String> _selectedValues = [];
here is the initState
void initState() {
super.initState();
_selectedValues = List.generate(_values.length, (index) => _values[0]);
}
Here is the data cell in which I am creating it dynamically,
DataCell(
Container(
child: DropdownButton(
value: _selectedValues[index],
items: _values
.map((value) => DropdownMenuItem(
value: value,
child: Text(value),
))
.toList(),
onChanged: (value) {
setState(() {
_selectedValues[index] = value!;
});
},
),)),
Here is the Error I am Getting,
Exception has occurred.
RangeError (RangeError (index): Invalid value: Not in inclusive range 0..9: 10)
any help is highly appreciated.
I have added a List.genrate , so all the dropdown initial value would be different and also If you change value of one drop down it wont affect others
List<String> _values = [
"m\u00b3",
"ft\u00b3",
"cm\u00b3",
"m\u00b2",
"ft\u00b2",
"cm\u00b2",
"kg",
"lb",
"ton",
"No\'s",
];
List<String> _values2 = [
"m\u00b3",
"ft\u00b3",
"cm\u00b3",
"m\u00b2",
"ft\u00b2",
"cm\u00b2",
"kg",
"lb",
"ton",
"No\'s",
];
the code
List.generate(
_values2.length,
(index) => DataRow(
cells: [
DataCell(
Container(
child: DropdownButton(
value: _values2[index],
items: _values
.map((value) => DropdownMenuItem(
value: value,
child: Text(value),
))
.toList(),
onChanged: (value) {
setState(() {
_values2[index] = value.toString();
});
},
),
),
),
],
),
);
I am trying to pass the index inside the Radio button list tile in order to set Locale language and also save settings into shared preferences.
This is a the part of main code where i want to pass the index:
body: CupertinoPageScaffold(
child: Container(
child: SingleChildScrollView(
child: Container(
child: CupertinoFormSection.insetGrouped(
header: Text('choose_a_language'.tr()),
children: [
RadioListTile( title: Text('English'), value: Language.English, groupValue: _selecLangIndex, subtitle: Text('English'), selected: _selectedIndex == 0 , onChanged: (newValue) =>
setState(() => _selecIndex = newValue)),
RadioListTile(title: Text('French'), value: Language.French, groupValue: _selecLangIndex, subtitle: Text('French'), selected: _selectedIndex == 1, onChanged: (newValue) =>
setState(() => _selecIndex = newValue)),
RadioListTile(title: Text('Italian'), value: Language.Italian, groupValue: _selecLangIndex, subtitle: Text('Italian'), selected: _selectedIndex == 2, onChanged: (newValue) =>
setState(() => _selecIndex = newValue)),
TextButton(onPressed:
_saveSettings,
child: Text('save'.tr().toUpperCase(),
style: TextStyle(fontWeight: FontWeight.bold),),
Right now on Save button, with onPressed method, i am able to save settings, but i cannot set locale language.
I also tried to implement this code, without any result.
void setLocale() {
int index = 0;
setState(() => _selectedIndex == index );
if (index == 0){
context.setLocale(Locale('en','US'));
}
else if (index == 1){
context.setLocale(Locale('fr','FR'));
}
else if (index == 2){
context.setLocale(Locale('it','IT'));
}
print(index);
}
You can do something like this
onChanged: (newValue) {
setLocale(); //
_selecIndex = newValue ;
setState((){});
},
If your setLocale is not using/updating the _selectedIndex. You can pass index on setLocale(0) and it doesnt need to have setState because we already call setState end of onChanged
I am using a dropdownbuttonfield and getting this error:
A value of type 'Object?' can't be assigned to a variable of type 'String'.
Try changing the type of the variable, or casting the right-hand type to 'String'.dart(invalid_assignment)
Code :
class SettingsForm extends StatefulWidget {
#override
_SettingsFormState createState() => _SettingsFormState();
}
class _SettingsFormState extends State<SettingsForm> {
final _formKey = GlobalKey<FormState>();
final List<String> sugars = ['0', '1', '2', '3', '4'];
final List<int> strengths = [100, 200, 300, 400, 500, 600, 700, 800, 900];
// form values
String? _currentName;
String? _currentSugars;
int? _currentStrength;
#override
Widget build(BuildContext context) {
MyUser user = Provider.of<MyUser>(context);
return StreamBuilder<UserData>(
stream: DatabaseService(uid: user.uid).userData,
builder: (context, snapshot) {
if (snapshot.hasData) {
UserData? userData = snapshot.data;
return Form(
key: _formKey,
child: Column(
children: <Widget>[
Text(
'Update your brew settings.',
style: TextStyle(fontSize: 18.0),
),
SizedBox(height: 20.0),
TextFormField(
initialValue: userData!.name,
decoration: textInputDecoration,
validator: (val) =>
val!.isEmpty ? 'Please enter a name' : null,
onChanged: (val) => setState(() => _currentName = val),
),
SizedBox(height: 10.0),
DropdownButtonFormField(
value: _currentSugars ?? userData.sugars,
decoration: textInputDecoration,
items: sugars.map((sugar) {
return DropdownMenuItem(
value: sugar,
child: Text('$sugar sugars'),
);
}).toList(),
onChanged: (val) => setState(() => _currentSugars = val), <--Error here **val** right one
),
SizedBox(height: 10.0),
Slider(
value: (_currentStrength ?? userData.strength).toDouble(),
activeColor:
Colors.brown[_currentStrength ?? userData.strength],
inactiveColor:
Colors.brown[_currentStrength ?? userData.strength],
min: 100.0,
max: 900.0,
divisions: 8,
onChanged: (val) =>
setState(() => _currentStrength = val.round()),
),
ElevatedButton(
style:
ElevatedButton.styleFrom(primary: Colors.pink[400]),
child: Text(
'Update',
style: TextStyle(color: Colors.white),
),
onPressed: () async {
if (_formKey.currentState!.validate()) {
await DatabaseService(uid: user.uid).updateUserData(
_currentSugars ?? snapshot.data!.sugars,
_currentName ?? snapshot.data!.name,
_currentStrength ?? snapshot.data!.strength);
Navigator.pop(context);
}
}),
],
),
);
} else {
return Loading();
}
});
}
}
Update Update 2
A value of type 'String?' can't be assigned to a variable of type 'String'.
Try changing the type of the variable, or casting the right-hand type to 'String'.
Try to give val as a String, or any type you want to to become:
onChanged: (val) => setState(() => _currentSugars = val as String),
Assign the generic type String to the DropdownButtonFormField:
DropdownButtonFormField<String>(
value: _currentSugars,
decoration: textInputDecoration,
items: sugars.map((sugar) {
return DropdownMenuItem(
value: sugar,
child: Text('$sugar sugars'),
);
}).toList(),
onChanged: (val) => setState(() => _currentSugars = val),
),
Unless you specify the type String dart makes the assumption with the one of the most generic types it has Object? as the generic type of the DropdownButtonFormField
Complete demo (Updated to use null safety)
class Demo extends StatefulWidget {
Demo({Key? key}) : super(key: key);
#override
_DemoState createState() => _DemoState();
}
class _DemoState extends State<Demo> {
final sugars = ['candy', 'chocolate', 'snicker'];
String? _currentSugars = 'candy';
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: DropdownButtonFormField<String>(
value: _currentSugars,
items: sugars.map((sugar) {
return DropdownMenuItem(
value: sugar,
child: Text('$sugar sugars'),
);
}).toList(),
onChanged: (val) => setState(() => _currentSugars = val),
),
),
);
}
}
This fixed my issue.
onChanged: (val) => setState(() =>
_currentSugars = val as String
),
You can use as String after the val.
if your using int value you can use as int as well.
I want to reset DropdownButtonFormField. I mange to reset it by setting it's value null and using globalkey as following code.
Here, problem is that i need to click twice to reset it.
Note: I know using DropdownButton, we can reset more easily but my question is why DropdownButtonFormField is not resetting when i click first time.
After Update:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatefulWidget {
#override
MyAppState createState() => MyAppState();
}
class MyAppState extends State<MyApp> {
String abc;
FocusNode _node = FocusNode();
GlobalKey<FormState> _key = GlobalKey<FormState>();
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Form(
key: _key,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Focus(
focusNode: _node,
onFocusChange: (bool focus) {
setState(() {});
},
child: Listener(
onPointerDown: (_) {
FocusScope.of(context).requestFocus(_node);
},
child: DropdownButtonFormField(
hint: Text('select value'),
value: abc,
items: <String>['A', 'B', 'C', 'D'].map((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (String newValue) {
setState(() {
abc = newValue;
});
},
),
),
),
Text("value is $abc"),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
setState(() {
abc = null;
_key.currentState.reset();
});
},
tooltip: 'Reset',
child: Icon(Icons.clear),
)),
);
}
}
you may need to make manual Focus
you need to give the global key to form as well
FocusNode _node = FocusNode();
...
Focus(
focusNode: _node,
onFocusChange: (bool focus) {
setState(() {});
},
child: Listener(
onPointerDown: (_) {
FocusScope.of(context).requestFocus(_node);
},
child: DropdownButtonFormField(
iconSize: 50,
onChanged: (s) {
setState(() {
abc = s;
});
},
hint: Text(
'Select Text',
),
items: [
DropdownMenuItem(value: '1', child: Text('A')),
DropdownMenuItem(value: '2', child: Text('B')),
DropdownMenuItem(value: '3', child: Text('C')),
DropdownMenuItem(value: '4', child: Text('D')),
],
),
),
),
...
FloatingActionButton(
onPressed: () {
setState(() {
print("hello");
abc = null;
_key.currentState.reset();
});
// _flyIronMan();
},
child: Icon(Icons.add),
),
Error code
Hi I'm new to flutter and have a question about dropdownbutton regarding using the same values for multiple dropdownbutton.
From my understanding from the error, it was due to using the same list for 2 or more dropdownbuttons in the same activity.
How am i able to resolve this error but still able to reuse the list for 2 or more dropdownbuttons?
String _value1;
String _value2;
final List<String> nameList = <String>[
"Name1",
"Name2",
"Name3",
"Name4",
"Name5",
"Name6",
"Name7",
"Name8"
];
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
elevation: 2.0,
title: Text('Hello'),
),
body: ListView(
children: <Widget>[
Row(
children: <Widget>[
Text('Name: '),
Center(
child: DropdownButton(
value: _value1,
onChanged: (value) {
setState(() {
_value1 = value;
});
},
items: nameList.map(
(item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
},
).toList(),
),
),
],
),
Row(
children: <Widget>[
Text('Name: '),
Center(
child: DropdownButton(
value: _value2,
onChanged: (value) {
setState(() {
_value2 = value;
});
},
items: nameList.map(
(item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
},
).toList(),
),
),
],
),
],
),
backgroundColor: Colors.grey[200],
);
}
}
I had the exact same error, multiple Dropdowns all feeding from the same static list, the only difference is that in my case, it was a list of Objects, not Strings.
So, if it's a static list, there's no way it's empty, no duplicate values in the list, AND you already make sure value is not empty? Then the only option remaining is that item.value is different than value
In my case, as it was an Object list, I had to overwrite operator == and hashcode methods in my Object class.
bool operator ==(dynamic other) =>
other != null && other is TimeSelection && this.hour == other.hour;
#override
int get hashCode => super.hashCode;
And that was it. I didn't had to initialize _value1 or _value2
You are getting that exception because _value1 and _value2 aren't initialized and providing empty to the dropdown widget.
You could do something like this:
DropdownButton(
value: _value1.isNotEmpty ? _value1 : null, // guard it with null if empty
items: nameList.map((item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
}).toList(),
);
This exception you have because of mistakes:
No _value1 and _value2 initialization.
When you initialize them make sure that _value1 and _value2 right from nameList e.g.
_value1 = nameList[0];
_value2 = nameList[3];
this is important step with complex data type, but in your case
_value1 = "Name1";
_value2 = "Name4";
will be sufficient.
Full example:
String _value1;
String _value2;
final List<String> nameList = <String>[
"Name1",
"Name2",
"Name3",
"Name4",
"Name5",
"Name6",
"Name7",
"Name8"
];
/// initialization is here:
#override
void initState() {
super.initState();
_value1 = nameList[0];
_value2 = nameList[3];
}
#override
Widget build(BuildContext context) {
return ListView(
children: <Widget>[
Row(
children: <Widget>[
Text('Name: '),
Center(
child: DropdownButton(
value: _value1,
onChanged: (value) {
setState(() {
_value1 = value;
});
},
items: nameList.map(
(item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
},
).toList(),
),
),
],
),
Row(
children: <Widget>[
Text('Name: '),
Center(
child: DropdownButton(
value: _value2,
onChanged: (value) {
setState(() {
_value2 = value;
});
},
items: nameList.map(
(item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
},
).toList(),
),
),
],
),
],
);
}
}
I have the same problem, and I solved it.
The dropdown button needs items list and value. We define items and selected items, but the item chosen instance does not inside the items list.
You should try this and fix your logic.
(value ıs selected item value for user)
var _value = itemList.isEmpty
? value
: itemList.firstWhere((item) => item.value == value.value);
More : https://gist.github.com/VB10/fd560694fec0a38751e798a213408001
You must initialise the _value1 and _value2 and make sure those values are also present in nameList.
My solution was more simple than every one else. The fact that was find a value that wasn't the same as in the list, is because I have put a value in the variable, that wasn't either full or empty, the value was this ("") and it has to be null for the Dropdown value instance. So, I just have put a value null in the declaration of variable. like: "String _value;", and voila, it worked.
#Sorry for the English, Brazilian here.
In my case, I use FormBuilderDropdown of the package flutter_form_builder.
Adding key: UniqueKey() in the Widget FormBuilderDropdown is the solution for my case.
I had same issue with Getx package. When it's updated, it causes this error because add same items to list. Adding key: UniqueKey() to DropdownButtonFormField is the solution for me.
You must initialise the _value1 and _value2 with a initial Value.
_value1 and _value2 variables need to be initialized, or you can do that:
value: _value1 != null ? _value1 : null,
hint: Text('Your hint'),
var _issues = [
"Subscription Related",
"Talk Therapy Related",
"Program Related",
"Account Related",
"Technology Related",
];
String _currentSelectedValue=_issues.first;
As much as the answer accepted may be working, it is unnecessary and over achieving.
All you need to do is ENSURE THAT whatever your initialized the value to is in the list as well. That is:
String _value1 = "Name1";
If the initialized value is not in your list, you will get the error message you are getting. Period!
If you are sure that your code is right then do "hot restart" instead of "hot reload".
this solved in my case
value: _value1,
onChanged: (value) {
setState(() {
_value1 = value;
_value2 = null;
});
},
The dropdownbuttonformfield filtering mechanism uses a single field for filtering. It can not filter by class hash. Set the DropdownMenuItem value to the key of the incoming data. The dropdownmenuItem value must be unique. The key is String type. currentStatus holds the key to position in the dropdown. I map a list of class objects where the class has databaseValue field and a displayValue field to the dropdownmenuitem as value:databaseValue and child:Text(displayValue). Now, I can set _currentStatus to a databaseValue and it will position in the dropdown.
String _currentStatus;
List<DropdownMenuItem> listMenuItems =
<DropdownMenuItem<String>>[];
Provider.of<Api>(context, listen: false)
.getComboViews()
.then((data) {
setState(() {
listMenuItems =
data.map<DropdownMenuItem<String>>((item) {
return DropdownMenuItem<String>(
value: item.databaseValue, child: Text(item.displayValue));
}).toList();
DropdownButtonFormField<String>(
value: this._currentStatus,
items: listMenuItems
onChanged: (String value) {
setState(() {
this._currentStatus = value;
});
);
String? dropdownValue
hint: Text( "Select City"),
value: dropdownValue == null ? null : dropdownValue,
onChanged: (String? newValue) {
setState(() {
dropdownValue = newValue;
});
},
items: <String>[
'Islamabad',
'RawalPindi',
'Mangla',
'Mirpur'
].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
Once you have Multiple DropDownButtons which are dependent on one another.
Adding key: (_value1 != null)
? Key(_value1)
: UniqueKey() to the dependent DropdownButtonFormField
children: <Widget>[
Row(
children: <Widget>[
Text('Name: '),
Center(
child: DropdownButton(
value: _value1,
onChanged: (value) {
setState(() {
_value1 = value;
});
},
items: nameList.map(
(item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
},
).toList(),
),
),
],
),
Row(
children: <Widget>[
Text('Name: '),
Center(
child: DropdownButton(
value: _value2,
key: (_value1 != null) ? Key(_value1) : UniqueKey()
onChanged: (value) {
setState(() {
_value2 = value;
});
},
items: nameList.map(
(item) {
return DropdownMenuItem(
value: item,
child: new Text(item),
);
},
).toList(),
),
),
],
You can use the same list in multiple DropDownButton. The error you got is because of having more than one same values in the list.
For Example, if I change the list to given below where I have two items having the same value, it will throw me an error.
`final List<String> nameList = <String>[
"Name1",
"Name1",
"Name3",
"Name4",
"Name5",
"Name6",
"Name7",
"Name8"
];`
Error:
_value1 and _value2 must be in your list
I solved this problem by specifying the type (in my case String): FormBuilderDropdown<String> and setting initialValue: null
I have Flutter 3.3.4
This happens when the value field type is not the same than the types used in items. Here is a example throwing the same error.
FittedBox(
fit: BoxFit.contain,
child: DropdownButton<E>(
//isExpanded: true,
value: box?.get(hiveKey), // hive key = string value --> need to convert to E type
onChanged: (final E? newValue) {
updateSettingsOnTap(box);
},
items: values.map<DropdownMenuItem<E>>((E value) {
return DropdownMenuItem<E>( // --> E type not string
value: value.item,
child: Text(value.getItemValue(), overflow: TextOverflow.ellipsis),
);
}).toList(),
You have to use the same type in value and items fields to fix it. Working code below.
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
FittedBox(
fit: BoxFit.contain,
child: DropdownButton<String>(
//isExpanded: true,
value: box?.get(hiveKey),
onChanged: (final String? newValue) {
updateSettingsOnTap(box);
},
items: values.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value, overflow: TextOverflow.ellipsis),
);
}).toList(),
Here is how I have implemented the dropdowns. This code handles exceptions in case list is not loaded or preselected value does not exist in the list. Also, it does provide validation on selected item.
Following is the Widget implementation ( e.g. froonodropdown.dart)
import 'package:flutter/material.dart';
class FroonoDropDown<T> extends FormField<T> {
final T? selectedValue;
final FocusNode? fnNode;
final void Function(T) onChanged;
final List<T> list;
final String Function(T) getLabel;
final String label;
FroonoDropDown(this.label, this.list, this.selectedValue, this.fnNode, this.onChanged, this.getLabel, {Key? key})
: super(
key: key,
validator: (T? item) {
return item == null ? "Please choose an option" : null;
},
initialValue: list.contains(selectedValue) ? selectedValue : null,
builder: (FormFieldState<T> state) {
List<DropdownMenuItem<T>> dropdownItems = [];
dropdownItems.add(DropdownMenuItem(value: null, child: Text("Select " + label)));
//handle exception in case list is not loaded or selectedValue is not part of the list
T? defaultValue = selectedValue;
if (selectedValue != null && !list.contains(selectedValue)) {
if (getLabel(selectedValue).isEmpty) {
defaultValue = null;
} else {
list.add(selectedValue);
}
}
dropdownItems.addAll(list.map((T item) {
return DropdownMenuItem(
value: item,
child: Text(getLabel(item)),
);
}).toList());
return Column(
children: <Widget>[
InputDecorator(
decoration: InputDecoration(labelText: label),
child: DropdownButtonHideUnderline(
child: DropdownButton(
focusNode: fnNode,
value: defaultValue,
isDense: true,
onChanged: (T? selectedItem) {
state.didChange(selectedItem);
if (selectedItem != null) onChanged(selectedItem);
},
items: dropdownItems),
),
),
if (state.hasError)
Align(
alignment: Alignment.centerLeft,
child: Text(state.errorText!, style: TextStyle(color: Theme.of(state.context).errorColor, fontSize: 12)),
)
],
);
},
);
}
Examples:
With String items:
FroonoDropDown<String>("String Items", stringItemsList, defaultValue, null, (String value) {
defaultValue = value;
//do something else with value;
}, (String item) => item)
With any custom class:
FroonoDropDown<CustomClass>("My Custom List", customClassObjsList,
defaultValue, null, (CustomClass value) {
defaultValue = value;
//do something else with value;
}, (CustomClass act) => act.title)
Make sure you override comparison operator and hashcode in your CustomClass, like this:
#override
bool operator ==(dynamic other) {
return other != null && typeid == other.typeid;
}
#override
int get hashCode => super.hashCode;
I hope above implementation would be useful for you!