html.Details does not fire callback

Dash Python
1

Hello,

I am using html.Details to create collapsible panels in Dash. I have a few panels, and when I expand one panel, would like all other panels to collapse.

I am able to set the status of the panel through ‘open’= True while defining the panels. I however am not able to get the callback to to trigger, when a panel is expanded. Below is the callback:

@app.callback(Output(‘plot_styling’, ‘open’),
[Input(‘plot_labels’, ‘open’),
Input(‘plot_sizing’, ‘open’),
Input(‘axes_settings’, ‘open’)])
def Plot_styling_collapse(value1, value2, value3):
if value1 or value2 or value3:
return False

I had defined the panels as below:

html.Details(open=True, id=‘plot_styling’, children=[…], style={‘marginBottom’: 5, ‘marginTop’: 5, ‘border-style’: ‘solid’, ‘border-width’: ‘1px’,
‘padding’: ‘10px 5px’}),

html.Details(open=False, id=‘plot_labels’, children=[…],
style={‘marginBottom’: 5, ‘marginTop’: 5, ‘border-style’: ‘solid’, ‘border-width’: ‘1px’,
‘padding’: ‘10px 5px’}),

html.Details(open=False, id=‘plot_sizing’, children=[…],
style={‘marginBottom’: 5, ‘marginTop’: 5, ‘border-style’: ‘solid’, ‘border-width’: ‘1px’,
‘padding’: ‘10px 5px’}),

2

Thanks for reporting! Right now, none of the dash_html_components components will fire callbacks when their attributes (like open) change. We should probably support this behaviour in the future.

3 Likes
3

@chriddyp any progress on getting these attributes to trigger callbacks?

For anyone else thinking they may be blocked entirely by this, a work around may be to use the n_clicks attribute of the Details objects, which also gets triggered if a user clicks to open or close the detail. You might then be able to use State('details_component', 'open') in a callback, though I’ve found the open attribute doesn’t actually update when a use changes it - related to it not triggering callbacks then also?

5 Likes
4

Have there been updates regarding this?

1 Like