I am creating an App using Flutter, and I have the following problem: On one screen I have a Dropdown where I select a country, when selecting it it saves the prefixes of that country in a list, the idea is to transfer that list to a second Dropdown where they will be shown the prefixes according to the selected country:
class _CountriesViewState extends ConsumerState {
@override
Widget build(BuildContext context) {
final countriesState = ref.watch(countriesProvider);
String? _selectedCountryIso;
String? _selectedPrefix;
List<String> selectedCountryPrefixes = [];
final List<String> countryNames = countriesState.countries.map((country) => country.countryName).toList();
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 18.0),
child: Form(
child: Column(
children: [
CustomDropdown(
labelText: 'País',
items: countryNames,
value: _selectedCountryIso,
onSelectionChanged: (newValue) {
setState(() {
selectedCountryPrefixes = countriesState.countries
.firstWhere((country) => country.countryName == newValue)
.prefix
.map((prefix) => prefix['Prefix']!)
.toList();
});
print("@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@");
print(selectedCountryPrefixes);
print("@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@");
//SO FAR, EVERYTHING IS GOOD, THE COUNTRIES ARE LOADING AND IN selectedCountryPrefixes THERE ARE THE PREFIXES, EXAMPLE: [1201, 1202, 1203, 1205, 1206]
},
onChanged: (newValue) {},
),
CustomDropdown(
labelText: 'Prefijo',
items: selectedCountryPrefixes,
value: _selectedPrefix,
//IN THIS DROPDOWN IT DOES NOT LOAD ANYTHING:(
onSelectionChanged: (newValue) {
},
onChanged: (newValue) {},
),
As I mentioned in the code, the first Dropdown works well, loads the countries and stores the prefixes in selectedCountryPrefixes like this [1201, 1202, 1203, 1205, 1206].
I have tried to do one thing and another but in the second Dropdown the prefixes are not loaded, I greatly appreciate your collaboration.
2
Answers
You declared
selectedCountryPrefixes
inside thebuild
method, which makes it get reinitialized to empty list every time the widget rebuilds. The print statement correctly printed the updated list because the widget has not rebuilt at that time.You should declare
selectedCountryPrefixes
in the state instead:Be aware that you’re also declaring
_selectedCountryIso
and_selectedPrefix
inside the build method which probably should be moved to the state as well.Try to check when the selectedCountryPrefixes is not empty then show the drop down