Multiple app callbacks not working on multipage app

Dash Python
1

Hi there,

I am trying to create a multipage app in Dash. Followed the structure suggested in the documentation and everything seems to be working fine with simple examples.

However, when one of the apps (pages) has multiple callbacks it seems like only the first one is working.

This is app1.py:

    app.layout = html.Div([
    html.Div([
        html.P([html.Label("Choose a group:"),
                dcc.RadioItems(id='groups_dropdown_1', options=[{'label': k, 'value': k} for k in all_options.keys()],
                             value='Inflation')],
               style=dict(width='400px')
               ),

        html.P([html.Label("Choose a series:"),
                dcc.Dropdown(id='series_dropdown_1_1')],
               style=dict(width='400px')
               ),
        dcc.Graph(
            id='plot_1_1',
            style=dict(width='100%')
        ),
        html.P([html.Label("Choose a series:"),
                dcc.Dropdown(id='series_dropdown_1_2')],
               style=dict(width='400px')
        ),
        dcc.Graph(
            id='plot_1_2',
            style=dict(width='100%')
        ),
        html.P([html.Label("Choose a series:"),
                dcc.Dropdown(id='series_dropdown_1_3')],
               style=dict(width='400px')
        ),
        dcc.Graph(
            id='plot_1_3',
            style=dict(width='100%')
        ),
    ]
])


@app.callback([Output('series_dropdown_1_1', 'options'),
               Output('series_dropdown_1_2', 'options'),
               Output('series_dropdown_1_3', 'options')],
              [Input('groups_dropdown_1', 'value')])
def set_series_options(selected_group):
    return [{'label': i, 'value': i} for i in all_options[selected_group]], \
           [{'label': i, 'value': i} for i in all_options[selected_group]], \
           [{'label': i, 'value': i} for i in all_options[selected_group]]


@app.callback([Output('series_dropdown_1_1', 'value'),
               Output('series_dropdown_1_2', 'value'),
               Output('series_dropdown_1_3', 'value')],
              [Input('series_dropdown_1_1', 'options')])
def set_series_value(available_options):
    return available_options[0]['value'], available_options[1]['value'], available_options[2]['value']

This is index.py:

app.layout = html.Div([
    dcc.Location(id='url', refresh=False),
    html.Div(id='page-content')
])


@app.callback(Output('page-content', 'children'),
              [Input('url', 'pathname')])
def display_page(pathname):
    if pathname == '/countries/app1':
        # runpy.run_path(r'C:\Quant\EM_Py\Interface\MultiPage\countries\app1.py')
        return app1.layout
    elif pathname == '/countries/app2':
        return app2.layout
    else:
        return '404'

if __name__ == '__main__':
    app.run_server(debug=True)

Any suggestions? Thanks a lot…

2 Likes
2

@mateidanvlad same here