Build dynamic list of option for dropdown with input

Dash Python
2

I was able to make some more progress as I looked more into the document about sharing data between callbacks.
https://dash.plot.ly/sharing-data-between-callbacks

I’m initiating the list and use the state of this list to update the list when “add” button is clicked.

# Add Ticker to New watchlist when add button is clicked


@app.callback(Output('new-watchlist', 'children'),
              [Input('add-button', 'n_clicks')],
              [State('ticker-input', 'value'),
               State('new-watchlist', 'children')]
              )
def stock_pick(n_clicks, ticker, watchList):
    # watchList = ['AMZN', 'GOOG', 'TSLA']
    # print(watchList)
    if(watchList is None):
        watchList = ['AMZN', 'GOOG', 'TSLA']
    else:
        if ticker is not None and ticker not in watchList:
            watchList.append(ticker)
        print("after add")
        print(watchList)
    return watchList

After “Add” button clicked, I got the new list
after add
[‘AMZN’, ‘GOOG’, ‘TSLA’, ‘C’]

Now that I have the list, I’m using the chained callback to update the options of my dropdown as the document suggests.

html.Div(id='new-watchlist'),

However, the very last piece is not working for me yet: this callback is not triggered when the value (new-watchlist children) is updated. One thing interesting is that this callback does get called once when the page is first loaded as the document specified, but not when the value are changed.

# Update Options in dropdown-watchlist


@app.callback(Output('dropdown-watchlist', 'options'),
              [Input('new-watchlist', 'children')]
              )
def update_dropdown(watchList):
    print("in update_dropdown")
    print(watchList)
    return [{'label': i, 'value': i} for i in watchList]

Advise is appreciated.