Black Lives Matter. Please consider donating to Black Girls Code today.

Clearing the contents of a hidden Div

I decided to use a hidden Div, along with a State, so it is populated with some data only when I click a button.

So far so good, except I only want the data to be used once by another callback, but because the data is there now (in the hidden Div), the callback always has access to it.

How would I go about clearing the contents of the Hidden Div immediately upon its use by another callback? My immediate solution would be to create a second callback targeting it and returning None, but you can’t have the same output targeted by 2 callbacks.

What do I do?

Use a dcc.Store, the second callback can then output to clear_data.

Is this the type of code that would do that? (stats-data being the dcc.Storage, and run_analysis being a html.Button)

@app.callback(
    Output(component_id='stats-data', component_property='clear_data'),
    [Input(component_id='run_analysis', component_property='n_clicks_timestamp')]
)
def rest_stats_choice(reset):  
    return True

Yes, you’d just need to PreventUpdate if the reset is None otherwise the data will be reset everytime the page is visited because of the None callbacks (only valid for local and session storage_type).

Thanks a lot, this is exactly what I wanted to be able to do. (I also guess I am very lucky that the dcc.Storage component came out just before my question)