Plotly: Submit button before Call back for the Checklist?

Question

I am developing Dash Data Visualization app where I have to select parameters given in the checklist as shown in figure. As I select/de-select the options from checklist one by one, back ground call back gets executed for every input.

For example, in image you can see the default value, I have selected all the 12 variables. But let's say when I only need to select 5 variables, and I try to de-select other 7 variables, background callback gets executed every time I de-select, in this case 7 times, which takes lot of time to execute, where ideally I would want it to be executed only once. Is there any changes I can make to the below code, like adding submit button, where the background code will be executed only when I want it, not when I select or de-select the checklist items?

dcc.Checklist(id='parameter-checklist',
    options=checklist_dict,
    value=available_indicators[:]
) 
    

Updating the code as stated in one of the comments:

Let's say I have to print the text selected as option from checklist in text box which has id 'text-is'. But it should only to be printed when some submit click is pressed, not every time I change the input of checklist.

import dash
import dash_core_components as dcc


available_indicators = ['Vorrollieren_Drehzah_Spindell',
 'Vorrollieren_Kraft_Spindell',
 'Vorrollieren_Kraft_Vorschub',
 'Vorrollieren_Weg']
checklist_dict = [{'label': 'Vorrollieren_Kraft_Spindell',
  'value': 'Vorrollieren_Kraft_Spindell'},
 {'label': 'Vorrollieren_Kraft_Vorschub',
  'value': 'Vorrollieren_Kraft_Vorschub'},
 {'label': 'Vorrollieren_Weg', 'value': 'Vorrollieren_Weg'}]


app.layout = html.Div(         
        [html.H3(children='Data Visualization For AK_Powertrain'),


dcc.Checklist(id='parameter-checklist',
    options=checklist_dict,
    value=available_indicators[:]
),  
)

@app.callback(
    [dash.dependencies.Output('text-id', 'value')
     ],
    [dash.dependencies.Input('parameter-checklist', 'value')
     ])
def update_graph_cluster( parameter_checklist):


    return parameter_checklist

Answer 1

OK, after bit of a research I found answer to this question.

We just have to use button in 'if' statement and then we can include checklist operation if button is pressed.

Code could look like below:

@app.callback(
    [ dash.dependencies.Input('parameter-checklist', 'value'),
     dash.dependencies.Input('btn-nclicks-1', 'n_clicks')])
def do_computation(parameter_checklist, btn1):

    changed_id = [p['prop_id'] for p in dash.callback_context.triggered][0]

    if 'btn-nclicks-1' in changed_id:

        print('button is pressed') 
        #do checklist operation

Answer 2

Yes, you can do that. Make the new submit button the Input to your callback, and use the values from the check boxes as State.

Edit: This is how you can structure the callback, assuming you add a button with the ID "submit_button" in your layout to work with this checklist. This way, the checklist does not activate the callback, only the button.

@app.callback(
    dash.dependencies.Output('text-id', 'value'),
    [
        dash.dependencies.Input('submit_button', 'n_clicks'),
    ],
    [
        dash.dependencies.State('parameter-checklist', 'value'),
    ])
def update_graph_cluster(button_clicks, parameter_checklist):
    # whatever callback code...