Skip to content

Dropdown reordering options by value on search #2667

Description

@TGeary

dash 2.14.0, 2.9.2
Windows 10
Chrome 118.0.5993.71

Description
When entering a search_value in dcc.Dropdown, the matching options are ordered by value, ignoring the original option order. This behavior only happens when the option values are integers or integer-like strings (i.e. 3 or "3" or 3.0 but not "03" or 3.1).

Expected behavior
The original order of the dropdown options should be preserved when searching.

Example
Searching "*" in the dropdown below returns all three results, but the options are reordered by ascending value.

fromdashimportDash, html, dccapp=Dash(
name=__name__,
)
my_options= [
{"label": "three *", "value": 3},
{"label": "two *", "value": 2},
{"label": "one *", "value": 1},
]
app.layout=html.Div(
[
dcc.Dropdown(
id="my-dropdown",
options=my_options,
searchable=True,
),
]
)

Dropdown_Search_Order

Attempted fixes
I expected Dynamic Dropdowns to give control over custom search behavior. However, even when a particular order of options is specified, the matching options are re-ordered by ascending value.

# This callback should overwrite the built-in search behavior.# Instead, the filtered options are sorted by ascending value.@app.callback(Output("my-dropdown", "options"),Input("my-dropdown", "search_value"),)defcustom_search_sort(search_value):
ifnotsearch_value:
raisePreventUpdatereturn [oforoinmy_optionsifsearch_valueinstr(o)]

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3backlogbugsomething broken

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions