Not able to see the checkbox in check list

Dash Python
1

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output

external_stylesheets = [‘https://codepen.io/chriddyp/pen/bWLwgP.css’]

app = dash.Dash(name, external_stylesheets=external_stylesheets)

all_options = {
‘America’: [‘New York City’, ‘San Francisco’, ‘Cincinnati’],
‘Canada’: [u’Montréal’, ‘Toronto’, ‘Ottawa’]
}
app.layout = html.Div([
dcc.RadioItems(
id=‘countries-radio’,
options=[{‘label’: k, ‘value’: k} for k in all_options.keys()],
value=‘America’
),

html.Hr(),

dcc.RadioItems(id='cities-radio'),

html.Hr(),

html.Div(id='display-selected-values')

])

@app.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]]

@app.callback(
Output(‘cities-radio’, ‘value’),
[Input(‘cities-radio’, ‘options’)])
def set_cities_value(available_options):
return available_options[0][‘value’]

@app.callback(
Output(‘display-selected-values’, ‘children’),
[Input(‘countries-radio’, ‘value’),
Input(‘cities-radio’, ‘value’)])
def set_display_children(selected_country, selected_city):
return u’{} is a city in {}’.format(
selected_city, selected_country,
)

if name == ‘main’:
app.run_server(debug=True)

Screenshot 2020-07-02 at 9.23.28 AM
Screenshot 2020-07-02 at 9.23.28 AM962×577 23.7 KB

2

Hi @Adijawla

I do not seem to see any problem with the example code that you have used.


import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

all_options = {
    'America': ['New York City', 'San Francisco', 'Cincinnati'],
    'Canada': [u'Montréal', 'Toronto', 'Ottawa']
}
app.layout = html.Div([
    dcc.RadioItems(
        id='countries-radio',
        options=[{'label': k, 'value': k} for k in all_options.keys()],
        value='America'
    ),

    html.Hr(),

    dcc.RadioItems(id='cities-radio'),

    html.Hr(),

    html.Div(id='display-selected-values')
])


@app.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]]


@app.callback(
    Output('cities-radio', 'value'),
    Input('cities-radio', 'options'))
def set_cities_value(available_options):
    return available_options[0]['value']


@app.callback(
    Output('display-selected-values', 'children'),
    Input('countries-radio', 'value'),
    Input('cities-radio', 'value'))
def set_display_children(selected_country, selected_city):
    return u'{} is a city in {}'.format(
        selected_city, selected_country,
    )


if __name__ == '__main__':
    app.run_server(debug=True, port=8022,use_reloader=False, host='127.0.0.1')