Davoud Taghawi-Nejad
Davoud Taghawi-Nejad

Reputation: 16786

How to activate a particular tab programatically

I would like to change a tab when a button is clicked. How to switch tabs?

app.layout = html.Div(children=[
    html.H1(children=title),
    dcc.Markdown(header),
    dcc.Tabs(id='graphs', children=[
             dcc.Tab(label='Run', children=html.Div(children=form), value=10),
             dcc.Tab(id='result', label='Result', children=graphs, value=1)],
             value=10)])

@app.callback(Output('result', 'children'),
              [Input('run_btn', 'n_clicks')],
              inputs)
def call_simulation(clicks, *params):
    params = dict(zip(parameter_mask.keys(), params))
    if clicks is not None:
        print(params)
        try:
            simulation(params)
            SWITCH TO RESULT TAB
        except Exception as e:
            print(e)
            return html.Div(children=["The simulation produced an error with this particular parameterisation", str(type(e)), str(e)])

        return generate_graph_layout(newest_subdirectory('./result', ''))
    else:
        return html.Div()

Upvotes: 0

Views: 2416

Answers (1)

Ed Rushton
Ed Rushton

Reputation: 799

You need a callback to set the value attribute of the dcc.Tabs element to the value attribute of the tab you want to switch to. So in your example you would need something like:

@app.callback(Output('graphs', 'value'),
          [Input('run_btn', 'n_clicks')],
          inputs)
def switch_tab(clicks, *params):
    if clicks is not None:
        return 1  # where 1 is the value of your results tab  

Upvotes: 5

Related Questions