dcc.Dropdown: Using Selected Label in Callback (Not Value)

Dash Python
1

Hi,

I have a question about dcc.Dropdown. Can I use the label selected (and not the value) in a callback?

This is what I’d ideally like to do:

app.layout = html.Div(
     children = [

          html.Div(id="print_subject"), 

          dcc.Dropdown(
                 id = "subject_dropdown",
                 options = [{'label':'Biology','value':1},{label:'Physics','value':2}],
                 placeholder = "Select Subject"
                 ),
          ]
  )


@app.callback(
        Output("print_subject","children"),
        Input("subject_dropdown","label_selected")
         )
def print(label):
     return label

print_subject should print the subject name and not its associated ID number.

Given Dash’s current implementation, I could probably get the label by adding subject_dropdown’s options as a State to the callback and then selecting the label by matching the value.

Is there an easier way to do this? Am I missing something?

2

Why not set the value be the same string as the label?

options = [{'label':'Biology','value':'Biology'},{label:'Physics','value':'Physics'}],

Then, the Input would change to get the value:

Input("subject_dropdown","value")
3

I need the ID numbers for queries.

4

ah ok…based on that, and without any other insight into your code, your solution to pass the dropdown’s options as a state parameter is probably the best. Or is it easier to alter your query to use the label vice an index #?

1 Like
5

I need the IDs. They’re more important to the app.

6

@mdylan2, have you found a solution? I have to deal with the same problem. Thank you very much!

7

Same problem here. Cant get the selected label from dcc.dropdown

8

Did not find a solution but I also stopped workin on that project a while ago.

9

I think the only option is doing it with State, as mentioned above. For example:

app.layout = html.Div(
     children = [

          html.Div(id="print_subject"), 

          dcc.Dropdown(
                 id = "subject_dropdown",
                 options = [{'label':'Biology','value':1},{label:'Physics','value':2}],
                 ),
          ]
  )


@app.callback(
        Output("print_subject","children"),
        [Input("subject_dropdown","value")],
        [State("subject_dropdown","options")]
)
def print_the_label(value_chosen, opt):
    print(opt) # to see what you're dealing with
    the_label = [x['label'] for x in opt if x['value'] == value_chosen]
    return the_label[0]
7 Likes
10

thanks man… by the way I am a big fan in your youtube channel. It helps me expedite my learning. More power you…

1 Like
11

Thank you Adam for putting that comment in an example!

The only downside is that State slows down my app terribly.

12

Here are two generic versions of this method I’ve used in my own apps. Thanks Adam!

def get_dropdown_label_from_value(dropdown_value: str, dropdown_options: list) -> str:
    dropdown_label = [x['label'] for x in dropdown_options if x['value'] == dropdown_value]
    return dropdown_label[0]


def get_all_dropdown_labels_from_values(dropdown_values: list, dropdown_options: list) -> list:
    dropdown_labels = []
    for drop_val in dropdown_values:
        dropdown_label_list = [x['label'] for x in dropdown_options if x['value'] == drop_val]
        dropdown_label = dropdown_label_list[0]
        dropdown_labels.append(dropdown_label)
    return dropdown_labels
1 Like