Setting Selected Value on Dropdown Lists

Hi,
I have various dropdownlists but what i want to know is how do i set the selected value on a dropdownlist. i pull the selected value from our database. here is the code to create and populate a list i use,

`class UserTitle {
String value;
String name;
UserTitle(this.value, this.name);
static List getTitle() {
return [
UserTitle(‘Mr’, ‘Mr’),
UserTitle(‘Miss’, ‘Miss’),
UserTitle(‘Ms’, ‘Ms’),
UserTitle(‘Mrs’, ‘Mrs’),
];
}
}

class _UserProfilePageState extends State {

@override
void initState() {

_dropdownTitleItems = buildDropdownTitleItems(_title);
_selectedTitle = _dropdownTitleItems[0].value;

super.initState();

}
List<DropdownMenuItem> buildDropdownTitleItems(List utitle) {
List<DropdownMenuItem> items = List();
for (UserTitle t in utitle) {
items.add(
DropdownMenuItem(
value: t,
child: Text(t.name),
),
);
}
return items;
}

onChangeTitleItem(UserTitle selectedTitle) {
_selectedTitle.value = _ttController.text;
setState(() {
_selectedTitle = selectedTitle;
});
}

body: Builder(
builder: (context) => Form(
key: _formKey,
child: ListView(
padding: EdgeInsets.all(15.0),
children: [
Container(
child: FutureBuilder(
future: getUserProfile(userid, authtoken),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.data == null) {
return Container(
child: Center(
child: Text(“Loading…”),
),
);
} else {
_selectedTitle.value =snapshot.data[0].title;
_ttController.text = snapshot.data[0].title;
_fnController.text = snapshot.data[0].firstname;
_mnController.text = snapshot.data[0].middlename;
_lnController.text = snapshot.data[0].lastname;
return …
Container(
padding:
EdgeInsets.fromLTRB(20.0, 0.0, 20.0, 0.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(32.0),
border: Border.all(
color: Colors.black,
style: BorderStyle.solid,
width: 0.80),
),
child: DropdownButton(
hint: Text(‘Please select your title’),
value: _selectedTitle,
items: _dropdownTitleItems,
onChanged: onChangeTitleItem,
),
),

I believe you want to pre-populate your DropdownMenuItem and further update it as per the user’s input right ?
I would suggest you to set up two things inside:
Inititally try to create a userData class which would pull the different parameters based on a specific user
and then;
1.) set value: _selectedTitle ?? userData.parameter,
2.) onChanged : setState((val) => _selectedTile=val),
[Based on the parameters you have declared above].Do acknowledge me if you understand :slight_smile: :+1:

Thanks for getting back to me, much appreciated.
yes we have a prepopulated drop down the (mr,mrs,miss,etc) that it gets from the UserTitle Class.
We then pull data from our database and based on that data we need then change the current selected value of the dropdown to whats saved in the database.
thanks
jamie

1.) set value: _selectedTitle ?? userData.parameter,
2.) onChanged : setState((val) => _selectedTile=val),

The ‘onChanged’ here will update your private variable _selectedTitle as soon as you update your value. And hence this will get you the updated selection :+1:t2: Do try it. Let me know for further queries(if any).

1 Like

Hi there,
I am still struggling with this dropdownbutton selecting the item from a list based on the Json data,
Tried what you suggested but getting an errors on the Onchanged.
This expression has a type of ‘void’ so its value can’t be used
The argument type ‘dynamic Function(dynamic)’ can’t be assigned to the parameter type ‘void Function()’.
So I changed the dropdownbutton to:

DropdownButton(
    icon: Icon(Icons.arrow_drop_down),
    hint: Text('Please select your title'),
    value: _selectedTitle ?? snapshot.data[0].title,        
    items: _dropdownTitleItems, 
   onChanged:  (value) {
     setState(() => _selectedTitle = value);
  },
),

but the onchanged doesnt fire when the page is loading to set the correct value/name.
I think it may have to do with the _selectedTitle coming from the UserTitle Class which is a name/value List and the snapshot.data[0].title being a single string.

class UserTitle {
  String value;
  String name;
  UserTitle(this.value, this.name);

  static List<UserTitle> getTitle() {
    return <UserTitle>[
      UserTitle('Mr', 'Mr'.),
      UserTitle('Miss', 'Miss'),
      UserTitle('Ms', 'Ms'),
      UserTitle('Mrs', 'Mrs.'),
    ];
  }
}```