Black Lives Matter. Please consider donating to Black Girls Code today.

Change state of all components from pattern matching callback

Hi, I have a problem as follows: a series of checkboxes are added to a dbc.table component, When one of the checkboxes changes, it triggers a callback. However, Only one checkbox should be selected at a time. I am using the pattern matching callback example to receive the callback input event, But I dont know how to change the state of all the other components (besides the one which triggered the callback). As I cannot have an output the same as an input without causing a callback loop.

import dash
import dash_core_components as dcc
import dash_html_components as html
import dash_bootstrap_components as dbc
from dash.dependencies import Input, Output, State, MATCH, ALL, ALLSMALLER
import pandas as pd


app = dash.Dash(__name__, suppress_callback_exceptions=True, external_stylesheets=[dbc.themes.CYBORG])



df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/beers.csv')

#Generate list of checklists to add to table (ID=index, value=brewery)
checkboxrange=[]
for i in range(df.index.size):
    checkboxrange.append(dcc.Checklist( 
            id={
                'type': 'brewery-selector',
                'index': str(i)
                },
            options=[
                    {
                    'label': str(df["brewery_id"].values[i]),
                    'value': str(df["brewery_id"].values[i]),
                    }
                ],
            value=[],
      
            )
        )

#add checklists to dataframe
df.insert(0, "visible", checkboxrange, True)

#filter
df = df.filter(["visible","beer","style"])
df = df.head(20)

#generate table
table = dbc.Table.from_dataframe(df,
    id="table",
    bordered=True,
    dark=False,
    hover=True,
    responsive=True,
    striped=True,
    )







app.layout = html.Div([
    html.Div(id='container-ex3', children=[table]),
        html.Div(id='callback_output', children=[]),

])



#Callback whenever one of the checkboxes are modifies
@app.callback(
    Output('callback_output', 'children'),
    [Input({'type': 'brewery-selector', 'index': ALL}, 'value')])
def checkboxchanges(checkbox):

    #check which checkbox was ticked
    #untick all others
    #return new textbox value to update other components (graph/socket etc)

    print(str(checkbox))

    return str(checkbox)















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