How to link the four dcc.dropdowns, except that brand has a one-to-one relationship with other dcc.dropdowns, and the rest are many-to-many
my code is
import pandas as pd
df_1=pd.DataFrame({"dd1":[1,1,1,2,2,3,3,3],"brand":['a','b','c','d','e','f','m','o'],
'dd3':["g","h",'o',"i","j","k","l",'n'],
"dd4":["u","v",'v',"w","x","y","z",'t']})
dd1_dd2_map={1:"a",2:"c",3:"e"}
dd1_options=[{'label': ta, 'value': ta} for ta in df_1["dd1"].unique()]
dd2_options=[{'label': ta, 'value': ta} for ta in df_1["dd2"].unique()]
dd3_options=[{'label': ta, 'value': ta} for ta in df_1["dd3"].unique()]
dd4_options=[{'label': ta, 'value': ta} for ta in df_1["dd4"].unique()]
from dash import Dash, dcc, html, Input, Output, State, callback_context
app = Dash(__name__)
app.layout = html.Div([
dcc.Dropdown(
options=dd1_options,
value=1,
id='dropdown1'
),
dcc.Dropdown(
options = dd2_options,
id='dropdown2'
),
dcc.Dropdown(
options=dd3_options,
id='dropdown3'
),
dcc.Dropdown(
options=dd4_options,
id='dropdown4'
)
])
@app.callback(
Output('dropdown2', 'options'),
Output('dropdown2', 'value'),
Output('dropdown3', 'options'),
Output('dropdown3', 'value'),
Output('dropdown4', 'options'),
Output('dropdown4', 'value'),
Input('dropdown1', 'value'),
Input('dropdown2', 'value'),
Input('dropdown3', 'value'),
Input('dropdown4', 'value')
)
def update_dropdowns(dropdown1_value, dropdown2_value, dropdown3_value, dropdown4_value):
ctx = callback_context
triggered_id = ctx.triggered[0]['prop_id'].split('.')[0]
df_1_filter=df_1.copy()
if triggered_id == 'dropdown1':
# Update dropdown2, dropdown3, and dropdown4 based on dropdown1_value
df_1_filter=df_1.loc[df_1["dd1"]==dropdown1_value]
dd2_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd2"].unique()]
dd3_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd3"].unique()]
dd4_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd4"].unique()]
return dd2_options, dd1_dd2_map.get(dropdown1_value), dd3_options, None, dd4_options, None
elif triggered_id == 'dropdown2':
df_1_filter=df_1_filter.loc[df_1_filter["dd2"]==dropdown1_value]
# Update dropdown1, dropdown3, and dropdown4 based on dropdown2_value
dd1_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd1"].unique()]
dd3_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd3"].unique()]
dd4_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd4"].unique()]
return dd1_options, None, dd3_options, None, dd4_options, None
elif triggered_id == 'dropdown3':
# Update dropdown1, dropdown2, and dropdown4 based on dropdown3_value
df_1_filter=df_1_filter.loc[df_1_filter["dd3"]==dropdown1_value]
# Update dropdown1, dropdown3, and dropdown4 based on dropdown2_value
dd1_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd1"].unique()]
dd2_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd2"].unique()]
dd4_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd4"].unique()]
return dd2_options, None, dd4_options, None, dd4_options, None
elif triggered_id == 'dropdown4':
# Update dropdown1, dropdown2, and dropdown3 based on dropdown4_value
df_1_filter=df_1_filter.loc[df_1_filter["dd4"]==dropdown1_value]
# Update dropdown1, dropdown3, and dropdown4 based on dropdown2_value
dd1_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd1"].unique()]
dd2_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd2"].unique()]
dd3_options=[{'label': ta, 'value': ta} for ta in df_1_filter["dd3"].unique()]
return dd2_options, None, dd3_options, None, dd4_options, None
return [], dd1_dd2_map.get(dropdown1_value), [], None, [], None
and it return error,how to fix the error