Dropdown Label vanished after selecting the disired item

Dash Python
1

Hello,

I have a problem with a dropdown element.

  1. Dynamic labels and values get loaded into the dropdown (works)
  2. After selecting an item, the label vanishes

Can sombody tell me what could be the problem ?

Regards,

Stefan

image
image1040×661 22.7 KB

2

Are you changing the dropdown labels dynamically? It might be a little easier to help you if you share some code :wink:

3

Sorry :slight_smile:

#Lese Namen der Arbeitsblätter (L-Baukasten) aus Excelfile aus
Baukasten_L=pd.ExcelFile('Baukasten_L.xlsx').sheet_names
Baukasten_L_map=pd.read_excel('Baukasten_L.xlsx', sheet_name=None)
#Lese Namen der Arbeitsblätter (S-Baukasten) aus Excelfile aus
Baukasten_S=pd.ExcelFile('Baukasten_S.xlsx').sheet_names
Baukasten_S_map=pd.read_excel('Baukasten_S.xlsx', sheet_name=None)
#Lese Rohrtabelle ein
Baukasten_PG_Rohr=pd.read_excel('Rohrzuordnung.xlsx', sheet_name="Zuordnung")
Baukasten_Rohrwandung=pd.read_excel('Rohrzuordnung.xlsx', sheet_name="Rohrwand")
Stutzen=Baukasten_Rohrwandung.columns.tolist() #Stutzengrößen

print(Baukasten_L)

#Laden des Stylesheets
app = dash.Dash(__name__)

#Layout (GUI) für Standalone Baukausten
app.layout = html.Div([
            dcc.Dropdown(
                id='Geometrie',
                options=[
                         {'label': 'S-Geometrie', 'value': 1},
                         {'label': 'L-Geometrie', 'value': 2}],
                value=1,
            ),
            dcc.Dropdown(
                id='Pumpentype'
            ),
            dcc.Dropdown(
                id='Stufenzahl',
            ),
            dcc.Dropdown(
                id='PG_WS',
                clearable=False,
            ),
            dcc.Dropdown(
                id='PG_Nozzle',
                options=[{'label': k, 'value': k} for k in Stutzen],
                clearable=False,
            ),
            html.Table([
                        html.Tr([html.Td('Basispumpe in S',style=dict(textAlign="center")),html.Td('Zulässige Axialkraft',style=dict(textAlign="center")),html.Td('Zulässiges Drehmoment',style=dict(textAlign="center"))]),
                        html.Tr([html.Td(id='Basispumpe',style=dict(textAlign="center")),html.Td(id='Kraft',style=dict(textAlign="center")),html.Td(id='Moment',style=dict(textAlign="center"))]),
            ]),
            html.Label(
                id='Test'
            ),
])

#Callback für Dropdown zum Einlesen der Daten für S bzw. L-Geometrie
@app.callback(
    Output('Pumpentype', 'options'),
    [Input('Geometrie', 'value')])
def Geometrieauswahl(Geometrie):
    if Geometrie==1:
        options=[{'label': k, 'value': k} for k in Baukasten_S]
    else:
        options=[{'label': k, 'value': k} for k in Baukasten_L]
    return options

#Callback zum Befüllen der Stufenzahl
@app.callback(
    Output('Stufenzahl', 'options'),
    [Input('Pumpentype', 'value'),Input('Geometrie', 'value')])
def Stufenauswahl(Pumpentype,Geometrie):
    if Geometrie==1:
        Stufen=Baukasten_S_map[Pumpentype]["Stufen"]
        options=[{'label': i, 'value': i} for i in Stufen]
    else:
        Stufen=Baukasten_L_map[Pumpentype]["Stufen"]
        options=[{'label': i, 'value': i} for i in Stufen]
    return options

#Callback für Auswahl der Pumpe und Rückgabe der Basispumpe inkl. zulässige Axialkraft und übertragbares Moment
@app.callback(
    [Output('Basispumpe', 'children'),Output('Kraft', 'children'),Output('Moment', 'children')],
    [Input('Pumpentype', 'value'),Input('Geometrie', 'value'),Input('Stufenzahl', 'value')])
def Stresses(Pumpentype,Geometrie,Stufenzahl):
    if Geometrie==1:
        Daten=Baukasten_S_map[Pumpentype]
        Basis=Daten.loc[Daten["Stufen"]==Stufenzahl,"Basis"].values[0]
        Kraft=Daten.loc[Daten["Stufen"]==Stufenzahl,"N"].values[0]
        Moment=Daten.loc[Daten["Stufen"]==Stufenzahl,"Nm"].values[0]
    else:
        Daten=Baukasten_L_map[Pumpentype]
        Basis=Daten.loc[Daten["Stufen"]==Stufenzahl,"Basis"].values[0]
        Kraft=Daten.loc[Daten["Stufen"]==Stufenzahl,"N"].values[0]
        Moment=Daten.loc[Daten["Stufen"]==Stufenzahl,"Nm"].values[0]
    return Basis,Kraft,Moment

#Callback für Wandstärkenauswahl von PG
@app.callback(
    Output('PG_WS', 'options'),
    [Input('Basispumpe', 'children')])
def Wandungen(Basispumpe):
    Rohrdurchmesser=Baukasten_PG_Rohr.loc[Baukasten_PG_Rohr["Type"]==Basispumpe,"Rohr"]
    Rohrdurchmesser_NPS=Baukasten_PG_Rohr.loc[Baukasten_PG_Rohr["Type"]==Basispumpe,"NPS"]
    Rohrdurchmesser_NPS.to_string()
    Wandungen=Baukasten_Rohrwandung[Rohrdurchmesser_NPS].values.tolist()
    Options=[{'label': l, 'value': l} for l in Wandungen]

    return Options
4

Do you mean like what is demonstrated in this video?
Here the first dropdown populates the second drop down with numbers n*v for n in [1…5] where v is the value from the first dropdown. Note that when I select a number v such that the new set doesn’t contain the number previously selected from the old set, the second dropdown can’t display anything so it goes back to displaying nothing. Is that what you mean?
ex

5

Hello nickest,

no in my case it behaves in an other way. If you look at the pictures in my previous post you can find 4 dropdowns. The first three work fine. but the last one does not show the selected value. I can work with the selected value (in example 7.04) but it is not displayed after selecting it.

regards

Stefan

6

Hmm this is certainly strange. Do you have any css files in the assets folder? If so perhaps try removing them? Perhaps the text is made white for some reason?

7

Hello nickest,

seems like I could solve the problem. It had nothing to do with dash itself. When I use iloc to get the column data then it works. :grinning:

@app.callback(
    Output('PG_WS', 'options'),
    [Input('Basispumpe', 'children')])
def Wandungen(Basispumpe):
    Rohrdurchmesser_NPS=Baukasten_PG_Rohr.loc[Baukasten_PG_Rohr["Type"]==Basispumpe,"NPS"].values
    Wandungen=Baukasten_Rohrwandung[Rohrdurchmesser_NPS].dropna()
    Wandungen=Wandungen.iloc[:,0]

    Options=[{'label': l, 'value': l} for l in Wandungen]

    return Options