Is it possible include multiple components within the same chained dash callback. Below, I have two countries within an initial callback. Based on which country is selected, associated cities are shown.
This works fine but I'm aiming to include multiple components based on the initial country callback. There are two sliders for each country that should appear below the associated cities.
At present, they don't get removed upon the relevent selection. They are fixed. As America
is a default, the two US sliders should be present. But if Canada
is chosen, these two sliders should drop for the Can
sliders.
Also, can the city items be used as a checklist, instead of radio items?
from dash import Dash, dcc, html, Input, Output, callbackexternal_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']app = Dash(__name__, external_stylesheets=external_stylesheets)all_options = {'America': ['New York City', 'San Francisco', 'Cincinnati'],'Canada': ['Montréal', 'Toronto', 'Ottawa']}app.layout = html.Div([ dcc.RadioItems( list(all_options.keys()),'America', id='countries-radio', ), dcc.RadioItems(id='cities-radio'), html.Label('US Slider 1', style = {'display': 'inline-block'}), dcc.Slider(0, 10, 2, value = 10, id = '' ), html.Label('US Slider 2', style = {'display': 'inline-block'}), dcc.Slider(0, 1, 0.2, value = 1, id = '' ), html.Label('Can Slider 1', style = {'display': 'inline-block'}), dcc.Slider(0, 10, 2, value = 0, id = '' ), html.Label('Can Slider 2', style = {'display': 'inline-block'}), dcc.Slider(0, 1, 0.2, value = 0, id = '' ), html.Div(id='display-selected-values')])@callback( Output('cities-radio', 'options'), Input('countries-radio', 'value'))def set_cities_options(selected_country): return [{'label': i, 'value': i} for i in all_options[selected_country]]@callback( Output('cities-radio', 'value'), Input('cities-radio', 'options'))def set_cities_value(available_options): return available_options[0]['value']if __name__ == '__main__': app.run_server(debug = True)