Hi I have a multi page app, and i need to store 4 objects (2 csv on a dictionary and 2 floats). I don´t have problems with the csv, but when i change of page i need to set again the 2 floats. It´s like the csv have been store but the floats don´t.
Here a chunk of code.
app.layout = html.Div([
dcc.Location(id="url"),
sidebar,
content,
dcc.Store(id="counts_store"),
dcc.Store(id="results_store"),
dcc.Store(id="p_store"),
dcc.Store(id="lfct_store")
])
And here my callback for the floats
@app.callback(
Output(component_id="p_store", component_property='data'),
Input("my_pvalue","value"))
def store_p(p):
return p
@app.callback(
Output(component_id="lfct_store", component_property='data'),
Input("my_lfct","value"))
def store_lfct(lfct):
return lfct
This is my first page where i upload the csv and set up the floats.
And this is the second page where i need the previous csv and the floats, the app don´t work it until set again the floats values.
Someone have an idea for why happens?
Hi,
Welcome to the community!
I have a few ideas… Could you share how you define the components with ids “my_pvalue” and “my_lfct” in each page?
If you add them with a specific value in the page layout, they might be overwriting the values stored in dcc.Store
. You might as well consider using persistence (as explained in the docs) in the inputs.
1 Like
Thanks for your reply. I’m going to read the persistence documentation.
I define p-value and lfct on both pages with the same code. (I only change a few minutes ago required to a False value but still doesnt work)
dcc.Input(
id='my_pvalue',
type="number",
placeholder="p-value", # A hint to the user of what can be entered in the control
debounce=False, # Changes to input are sent to Dash server only on enter or losing focus
min=0, max=1, step=0.000001, # Ranges of numeric value. Step refers to increments
minLength=0, maxLength=8, # Ranges for character length inside input box
autoComplete='on',
required=False, # Require user to insert something into input box
size="8", # Number of characters that will be visible inside box
style={'display':'block','width':"34%"}),
dcc.Input(
id='my_lfct',
type="number",
placeholder="lfct",
debounce=False,
min=0, max=10, step=0.000001,
minLength=0, maxLength=8,
autoComplete='on',
required=False,
size="20",
style={'display':'block','width':"34%"})]
Thanks for sharing it! You are indeed rewriting the components each time you navigate to a new page, but since you are not passing the value
prop to it, then it gets None
and the callback to update the dcc.Store
will be triggered with None
, clearing the store.
The easiest fix is to use persistence=True
in the component, then it will preserve the value as long as you are using the same id for the component in each page. By default it will use persistence_type="local"
, which will preserve the choice in the same browser indefinitely, but you could very well switch to “session” to preserve it when page reloads, but not after the browser is closed.
1 Like