Synchronise Python Plotly/Dash Core Components Checklist State Across Multiple Instances

I am creating a dash app in python that can be accessed via a web browser which uses the dash core components checklist item. I provide a minimal example below

import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash(__name__)

app.layout = html.Div([
    html.Div([
        dcc.Checklist(
                    options=[
                        {'label': 'New York City', 'value': 'NYC'},
                        {'label': 'Montréal', 'value': 'MTL'},
                        {'label': 'San Francisco', 'value': 'SF'}
                    ],
                    value=['NYC', 'MTL']
                )
    ])
])

app.run_server(port=8050)

what this does is create an app that can be accessed on http://localhost:8050/ showing three checkboxes. I would like the state of these checklist items to be synchronised across multiple users that may be accessing this page.

In other words, if I open two separate tabs with the address http://localhost:8050/ after starting this app, say tab 1 and tab 2. Any changes I make on tab 1 to the state of the checklist should be reflected in the state of the checklist on tab 2 as well. Right now, changes to the checklist state in tab 1 do not affect the state in tab 2.

I imagine the solution involes using @app.callback events on some method with the Input and Output classes from the from dash.dependencies module but I haven’t quite figured out the best way yet. Any help is much appreciated

1 post - 1 participant

Read full topic