Dcc.dropdown component

[assad_zafar]

app.layout = html.Div([
    'Pick a Color',
    dcc.Dropdown(options=['Red','Green','Blue'],id='color-input'),
    dcc.Markdown(children= '',id='color-output')
])

@callback(Output("color-output",'children'),
              Input('color-input','value'))

def update_output_div(color):
    print(color)
    print(type(color))
    if not color:
        raise PreventUpdate
    return f'Color Selected : {color}'

when i press x icon in dropdown component it still show one color that was not selected

[adamschroeder]

Welcome to the community, @assad_zafar

I think this is happening because of the PreventUpdate:

    if not color:
        raise PreventUpdate

If you chose Red, and then click the X icon in the dropdown, the callback will not update anything, so the color stays the same. Try this:

    if not color:
        return 'No Color Selected'

[assad_zafar]

ok thanks it works