Skip to content

Dropdown 'x' button throws error #91

@thomasantony

Description

@thomasantony

The following code implements a simple Dropdown that updates a Div element.

import dash
import dash_core_components as dcc
import dash_html_components as html

from dash.dependencies import Input, Output

app = dash.Dash()
app.layout = html.Div([
    html.H1(children='Dropdown test'),
    dcc.Dropdown(
                id='test-selector',
                placeholder='Select a value',
                options=[{'label':'foo', 'value':0},{'label':'bar', 'value':1},{'label':'baz', 'value':2}],
    ),
    html.Div(
        id='foobar'
    )

])

@app.callback(
    Output(component_id='foobar', component_property='children'),
    [Input(component_id='test-selector', component_property='value')]
)
def test_interaction(value):
    print(value)
    return value

if __name__ == '__main__':
    app.run_server(debug=True)

If you click the second or third options, a small "x" button appears on the right end of the component.
dropdown-button

I expected the dropdown to be cleared of any selection I clicked the 'x'. Instead, I get the following error in the console:

Uncaught TypeError: Cannot read property 'value' of null
    at Object.onChange (https://unpkg.com/dash-core-components@0.5.3/dash_core_components/bundle.js:13:31574)
    at Object.setValue (https://unpkg.com/dash-core-components@0.5.3/dash_core_components/bundle.js:11:11319)
    at Object.clearValue (https://unpkg.com/dash-core-components@0.5.3/dash_core_components/bundle.js:11:12224)
    at Object.r (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:14:5395)
    at a (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:12:22306)
    at Object.s [as executeDispatchesInOrder] (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:12:22496)
    at f (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:12:18835)
    at m (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:12:18961)
    at Array.forEach (native)
    at r (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:15:12116)
    at Object.processEventQueue (https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js:12:20039)

I am using the following versions:

>>> dash.__version__
'0.17.7'
>>> dcc.__version__
'0.5.3'
>>>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions