Discovery: dash_core_components Dropdown() requires explicitly labeled options

Solved!
MarkPundurs
Level 3
Discovery: dash_core_components Dropdown() requires explicitly labeled options

I was unable to get a dash_core_components Dropdown control to display non-null options in a webapp using the parameter format

options=['New York City', 'Montreal', 'San Francisco']

It worked only when I changed this to

options=[{'label': i, 'value': i} for i in ['New York City', 'Montreal', 'San Francisco']]


Operating system used: Linux

0 Kudos
1 Solution
ZachM
Dataiker

Hi @MarkPundurs,

The following code works for me using Dash v2.7.0:

from dash import dcc, html, Dash, Input, Output

options = ['New York City', 'Montreal', 'San Francisco']

app.layout = html.Div(children=[
    dcc.Dropdown(options, id='demo-dropdown'),
    html.Div(id='dd-output-container')
])

@app.callback(
    Output('dd-output-container', 'children'),
    Input('demo-dropdown', 'value')
)
def update_output(value):
    return f'You have selected {value}'

image.png

Could you please share a full code example, a screenshot of the issue, and the Dash version that you're using?

Thanks,

Zach

View solution in original post

2 Replies
ZachM
Dataiker

Hi @MarkPundurs,

The following code works for me using Dash v2.7.0:

from dash import dcc, html, Dash, Input, Output

options = ['New York City', 'Montreal', 'San Francisco']

app.layout = html.Div(children=[
    dcc.Dropdown(options, id='demo-dropdown'),
    html.Div(id='dd-output-container')
])

@app.callback(
    Output('dd-output-container', 'children'),
    Input('demo-dropdown', 'value')
)
def update_output(value):
    return f'You have selected {value}'

image.png

Could you please share a full code example, a screenshot of the issue, and the Dash version that you're using?

Thanks,

Zach

MarkPundurs
Level 3
Author

I was on dash 1.21; once I upgraded, your code worked, as does

dcc.Dropdown(options, id='demo-dropdown', value='Montreal', multi=True)

0 Kudos

Labels

?
Labels (2)
A banner prompting to get Dataiku