Dropdown with multi not working

Dash Python
1

I am not able to reproduce the nice multi-select mode of Dropdown component. I created the most barebones app possible and am seeing this behavior. I cannot change the selection. Chrome Console spits out some react errors.

plotlydashissue.gif826Ă—767 175 KB

Here is my app:

Version info (pulled updates ten minutes ago):

plotly (2.0.12)
dash (0.17.7)
dash-core-components (0.5.3)
dash-html-components (0.6.2)
dash-renderer (0.7.3)
python                    3.5.2
2

Hey @PeterS, thanks for raising! This is actually “expected” right now. The components won’t really work properly until they have a callback assigned to them. There was a little note about this in the documentation, but it’s easy to miss:

Notice that these elements aren’t interactive yet: clicking on the checkboxes, dragging the slider, and entering text in the input doesn’t update the component. These components will become interactive in the final section of this tutorial on interactivity.

There have been a few questions about this already so I think that I’ll modify the behaviour of these components to work as expected without callbacks.

In your case, just add something like:

1 Like
3

Thanks! I think I know what to add, but I think you left out the example from your post.

This is what I did to get this simple example working:

# -*- coding: utf-8 -*-
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Output, Input

app = dash.Dash('')

app.layout = html.Div([dcc.Dropdown(
        id='my-dropdown',
        options=[
            {'label': 'New York City', 'value': 'NYC'},
            {'label': 'Montreal', 'value': 'MTL'},
            {'label': 'San Francisco', 'value': 'SF'}
        ],
        value="MTL",
        multi=True),
html.P(id='my-para')])

@app.callback(
    Output('my-para', 'children'),
    [Input('my-dropdown', 'value')])
def dummy(selection):
    return ''

if __name__ == '__main__':
    app.server.run(debug=True)