# Graph not updating with dropdown menu

**URL:** <https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768>\
**Category:** Dash Python\
**Created:** [August 16, 2018, 10:00am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768 "2018-08-16T10:00:48Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![dominique](https://avatars.discourse-cdn.com/v4/letter/d/e99b99/32.png) [@dominique](https://community.plotly.com/u/dominique)\
**Post date:** [August 16, 2018, 10:00am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768/1 "2018-08-16T10:00:48Z")

</div>

I am trying to build a dashboard where the graph updates depending on the value passed in the dropdown menu.

For some reason, the graph does not adapt to any changes in the dropdown. Peculiarities about this are:

1. The input is for sure received: I created a second function which has the same structure but updates a different field. It works fine.

2. The problem seems to be with the graph display: I created a different version of the function where the update function would return “none” for the default value of 1. The area of the graph was empty at first but would change to one of the graphs when a new value was selected in the dropdown. Once a graph was shown, the field would not react to any further changes in the dropdown menu: Neither for values prompting a new graph nor for the return to the default value returning none.

EDIT: I am also not getting any error messages. On changing the dropdown menu the console writes:  
127.0.0.1 - - [16/Aug/2018 12:58:35] “POST /\_dash-update-component HTTP/1.1” 200 -

This is the code:

```
import dash
from dash.dependencies import Output, Event
import dash_core_components as dcc
import dash_html_components as html
import plotly
import plotly.graph_objs as go
from dash.dependencies import Input, Output
import collections

app = dash.Dash()

df = dm.return_all_pd_data(token = API_TOKEN)

app.layout = html.Div(children=[
    html.H1(children='''
        Month for graph:
    '''),
    dcc.Dropdown(
        id = "input",
        options=[
            {'label': 'Jan', 'value': 1},
            {'label': 'Feb', 'value': 2},
            {'label': 'Mar', 'value': 3}
        ], value = 1
    ),
    html.Div(id='output-graph'),
])

@app.callback(
    Output(component_id='output-graph', component_property='children'),
    [Input(component_id='input', component_property='value')])
def update_value(value):

    start = datetime.datetime(2018, value, 1, 0, 0, 0, 1)
    end = datetime.datetime(2018, value + 1, 1, 0, 0, 0, 1)
    subset_df = df[(df["lost_time"] > start) & (df["lost_time"] < end) ]

    x = pd.value_counts(subset_df.deal_source).index
    y = pd.value_counts(subset_df.deal_source).values

    return(dcc.Graph(
        id='output-graph',
        figure={
            'data': [
                {'x': x, 'y': y, 'type': 'bar', 'name': value},
            ],
            'layout': {
                'title': "You selected month: {}".format(value)
            }
        }
    ))

if __name__ == " __main__":

    app.run_server(debug = True)
```

---

<div class="post-metadata">

**Author:** ![Ola](https://avatars.discourse-cdn.com/v4/letter/o/dbc845/32.png) [@Ola](https://community.plotly.com/u/Ola)\
**Post date:** [August 16, 2018, 10:56am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768/2 "2018-08-16T10:56:08Z")

</div>

You should check the error message you’re getting in the console… should clarify things 🙂  
for that, remove the `debug = True`

---

<div class="post-metadata">

**Author:** ![dominique](https://avatars.discourse-cdn.com/v4/letter/d/e99b99/32.png) [@dominique](https://community.plotly.com/u/dominique)\
**Post date:** [August 16, 2018, 11:00am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768/3 "2018-08-16T11:00:33Z")

</div>

Hi Ola,

Thanks for your help first of all.

The peculiar thing is that I am not getting any error message. The only thing the console is writing is:  
127.0.0.1 - - [16/Aug/2018 12:58:35] “POST /\_dash-update-component HTTP/1.1” 200 -

which I assume is supposed to mean that everything is working

Do you have an idea what the problem might be?

---

<div class="post-metadata">

**Author:** ![Ola](https://avatars.discourse-cdn.com/v4/letter/o/dbc845/32.png) [@Ola](https://community.plotly.com/u/Ola)\
**Post date:** [August 16, 2018, 11:12am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768/4 "2018-08-16T11:12:42Z")

</div>

i think you should try defining an empty graph in the layout, and returning a dict with the updates  
so,

> [@dominique](#):
>
> (dcc.Graph( id=‘output-graph’

in the layout…  
and the callback would be  
` Output(component_id='output-graph', component_property='figure')`  
and you’d just return the following dict,

> [@dominique](#):
>
> { ‘data’: [{‘x’: x, ‘y’: y, ‘type’: ‘bar’, ‘name’: value},], ‘layout’: { ‘title’: “You selected month: {}”.format(value) } }

Cheers!

---

<div class="post-metadata">

**Author:** ![dominique](https://avatars.discourse-cdn.com/v4/letter/d/e99b99/32.png) [@dominique](https://community.plotly.com/u/dominique)\
**Post date:** [August 16, 2018, 11:18am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768/5 "2018-08-16T11:18:54Z")

</div>

Works! Amazing thank you Ola! 🙂

---

<div class="post-metadata">

**Author:** ![kychanbp](https://avatars.discourse-cdn.com/v4/letter/k/43a26b/32.png) [@kychanbp](https://community.plotly.com/u/kychanbp)\
**Post date:** [November 15, 2018, 3:13am UTC](https://community.plotly.com/t/graph-not-updating-with-dropdown-menu/12768/6 "2018-11-15T03:13:04Z")

</div>

@Ola

Can you provide the reason for doing so?

I tried your solution. It works. But I don’t know why.