import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
USA = [
"New York",
"San Francisco",
"Cincinnati",
]
CANADA = [
"Montréal",
"Toronto",
"Ottawa",
]
country_dict = dict(USA=USA, CANADA=CANADA)
app = dash.Dash()
app.css.append_css({"external_url": "https://codepen.io/chriddyp/pen/bWLwgP.css"})
app.layout = html.Div([
dcc.Dropdown(
id="countries_dropdown",
options=[
{'label': 'America', 'value': 'USA'},
{'label': 'Canada', 'value': 'CANADA'},
],
value=["USA"],
multi=True,
),
dcc.Dropdown(
id="cities_dropdown",
),
])
@app.callback(
Output("cities_dropdown", "options"),
[Input("countries_dropdown", "value")],
)
def update_cities_options(countries):
cities = []
for country in countries:
cities += [dict(label=cities, value=cities) for cities in country_dict[country]]
return cities
@app.callback(
Output("cities_dropdown", "value"),
[Input("cities_dropdown", "options")],
)
def update_cities_value(cities):
if len(cities) != 0:
return cities[0]
else:
return None
if __name__ == "__main__":
app.run_server(debug=True)
I get error:
Invalid argument value
passed into Dropdown with ID “cities_dropdown”. Value provided: { “label”: “New York”, “value”: “New York” }
What could be the error?
Thanks