Hello,
I would to update inputs on multiple pages starting from the main page. I explain my problem :
I have 1 main page with multiple inputs and a list of strategies (chosen by the user). When I click on a button it open 1 page for each strategy selected and the common inputs must be the same than the main page.
Here is my code :
list_strategies = [strat1, strat2, start3]
list_end = [20, 25, 30]
First_page = html.Div([
html.Div([dcc.Dropdown(id='strategy', options=[{'label': i, 'value': i} for i in list_strategies], multi=True)])
html.Div([dcc.Input(id='value_start', type='text', value=10)]),
html.Button('Update datas', id='button_transfer'),
html.Button('Open page', id='button'),
html.Div(id='hidden-div', style={'display': 'none'})
])
MyLayout = []
for i in range(len(list_strategies)) :
MyLayouti = html.Div([
html.Div([dcc.Dropdown(id='strategy'+str(i), options=[{'label': i, 'value': i} for i in list_strategies], value=list_strategies[i])])
html.Div([dcc.Input(id='value_start'+str(i), type='text', value=10)]),
html.Div([dcc.Input(id='value_end'+str(i), type='text', value=list_end[i])]),
html.Button('Create Graph', id='button'+str(i)),
dcc.Graph(id='graph'+str(i), config={'editable': True, 'modeBarButtonsToRemove': ['sendDataToCloud', 'hoverClosestCartesian', 'hoverCompareCartesian']}),
])
MyLayout.append(MyLayouti)
And the layout printed on each page is chosen with the following code :
# start a Dash Application
app = dash.Dash()
app.config.suppress_callback_exceptions = True
app.layout = html.Div([
dcc.Location(id='url', refresh=False),
html.Div(id='page-content'),
])
# Update the index
@app.callback(dash.dependencies.Output('page-content', 'children'),[dash.dependencies.Input('url', 'pathname')])
def display_page(pathname):
for i in range(len(list_strategies)) :
if pathname == '/page-'+str(list_strategies[i]) : return MyLayout[i]
if pathname == '/' : return First_page
list_event = [Event('button', 'click')]
list_state = [State('strategy', 'value')]
@app.callback(Output('hidden-div', 'children'),events=list_event, state = list_state)
def create_callback_share(list_strategies_used):
for _strat in list_strategies_used :
time.sleep(1)
webbrowser.open('http://localhost:9992/page-'+_strat)
Now, to transfer the starting date chosen by the user, I have created a callback, triggered by the button “Update datas”. I click on that button then I click on “Open Page” to open the different webpage. My callback is the following :
for i in range(len(list_strategies)) :
@app.callback(Output('value_start'+str(i), 'value'),events=[Event('button_transfer', 'click')], state = [State('value_start', 'value')])
def create_callback_passarg(selected_element):
test_variable = selected_element
return "{}".format(selected_element)
The problem is that callback does not work through multiple page. I can use it to modify input on the same page (for example I can use value_start to modify another variable on the first page) but the update does not work for the other page.
It is impossible to use callback through pages ?
Does another exists to update such inputs ?
Thank you!