Bring Drag & Drop to Dash with Dashboard Engine. 💫 Learn how at our next webinar!

How to make a hide the selected item in dropdown list

Hi Teams,

I try to use plotly to make a dashboard with python and mysql.
Dash plotly is great! Thanks for your great work.

Here is the problem i met:

if the selected item in dropdown list is too much, the layout will be so terrible long,
how can i hide the selected item?

more like the dropdown list in Tableau:

multi_dropdown_list

multi_dropdown_list_2

What do you mean by having a long layout? In the examples of dcc.Dropdown, there is “Multi-Value Dropdown” example. Could it possibly help you? For example:

import dash_core_components as dcc

dcc.Dropdown(
    options=[
        {'label': 'New York City', 'value': 'NYC'},
        {'label': 'Montreal', 'value': 'MTL'},
        {'label': 'San Francisco', 'value': 'SF'}
    ],
    value=['MTL', 'NYC'],
    multi=True
)  

The output looks like this:

The selected values are put one after another inside the dropdown component, and the total size of the dropdown component stays compact.

if you selected more than 10 or 20 values…
the problem is just because the total size of the component stays compact, it’s getting bigger and bigger…

any ideas?
or is there any component like primefaces?