I have searched similar answers to my question but non sufficed mine, Maybe my approach if difficult.
Here is what I'm trying to do, I have an API for country values. for registering the user I use a dropdown as below which maps the CountryApi values to its items. In my hand I have the country name only.
how can I set the initial value of that dropdown to match with the country name I have?
Country Select DropDown
CountryModal _selectedCountry;
onChangeDropdownItem(CountryModel selectedCountry) {
setState(() {
// fieldFocusChange(context, _countryFocusNode, _phoneFocusNode);
_selectedUserCountry = selectedCountry;
_userCountry = _selectedUserCountry.name;
countryCodeTxt = _selectedUserCountry.dial_code;
countryCode = _selectedUserCountry.code;
_userCountryId = _selectedUserCountry.id.toString();
});
}
/////
userCountryDropdown = Container(
padding: EdgeInsets.all(2.0),
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(
10.0,
)),
color: Color(0xFFF0F0F0),
shape: BoxShape.rectangle),
child: DropdownButton<CountryModel>(
isExpanded: true,
hint: Text(
'Select Country',
style: kMainContentStyleLightBlack,
),
autofocus: true,
value: _selectedUserCountry,
isDense: false,
onChanged: onChangeDropdownItem,
items: _countryList.map((country) {
return DropdownMenuItem<CountryModel>(
child: new Text(country.name),
value: country,
);
}).toList(),
style: kMainContentStyleLightBlack,
),
);
My Country API looks in this format
CountryAPI
[
{
"id": 1,
"code": "AF",
"dial_code": "+93",
"name": "افغانستان"
},
{
"id": 2,
"code": "AX",
"dial_code": "+358",
"name": "Åland"
},
....
Can someone help me to figure this out and workaround to resolve?