Black Lives Matter. Please consider donating to Black Girls Code today.

Sort dropdown values by alphabet

Hi all,

I would like to sort the values in dropdown alphabetically. The dropdown values are coming from a dataframe column; I was trying to sort the column, but when the values are still unsorted when they’re on dash app.

Any comments or suggestions on this issue?

Thank you,
Erica

You will need to add sorted to the options call to dcc.Dropdown

dcc.Dropdown(id='dropdown',
             options=[{'label': x, 'value': x}
                      for x in sorted(['one', 'two', 'three', 'four', 'five'])])
Dropdown(id='dropdown', options=[{'label': 'five', 'value': 'five'}, {'label': 'four', 'value': 'four'}, {'label': 'one', 'value': 'one'}, {'label': 'three', 'value': 'three'}, {'label': 'two', 'value': 'two'}])

As you can see above the options are sorted alphabetically, and they should appear sorted in the dropdown.

Hope that helps :slight_smile:

1 Like

Perfect! Thank you! :slight_smile:

1 Like