The callback does not update the dash table

Dash Python
1

Hello.
Please help me figure out the dash table callback. The callback doesn’t work for me. I’m new to dash

'''  Filtering the data '''
@app.callback(
    Output('filtered_data', 'data'),
    [Input('submit_val', 'n_clicks')],
    [State('dt_selector', 'start_date'),
    State('dt_selector', 'end_date')]
)
def filter_data(n, start_date, end_date):
    start_date = datetime.strptime(start_date, '%Y-%m-%d')
    end_date = datetime.strptime(end_date, '%Y-%m-%d')
    
    my_data = df.query(Date>= @start_date  and Date <= @end_date')
    return my_data.to_json(date_format='iso', orient='split',
                          default_handler=str)


@app.callback(
    Output('Table1', 'children'),
    [Input('submit_val', 'n_clicks'),
    Input('filtered_data', 'data'),]
)
def update_table(n, data):
    d=pd.read_json(data, orient='split')
    d['Date'] = pd.to_datetime(d['Date'], format = '%Y-%m-%d').dt.strftime('%Y-%m-%d')
    if len(d)==0:
        return html.Div('Please select more options')

# Here I am creating a pivot table, however, even just changing the parameters on the input table does not give any change

    return html.Div([
                dash_table.DataTable(
                id='Table1',
                data=d.to_dict('records'),
                columns=[{"name": i, "id": i} for i in d.columns],
                filter_action='native',    
                column_selectable="multi",
                editable=True)
        ])
2

hi @Katerina
Welcome to the Dash community.

What does the filtered_data id belong to? what component?

3

Hello.

dcc.Store(id='filtered_data', storage_type='session')

It even seems to me that output works. I work in Jupiter Dash with browser output. So, when you press the button, nothing happens. If you restart the cell, the selected dates are displayed, although they return to their original appearance in the selector. And the page in the browser writes “Update…” endlessly

Button

dbc.Col(dbc.Button('OK', id='submit_val', n_clicks=0)
4

Hi @Katerina
The problem is that the first and second callback pretty much get triggered at the same time because they have the same button input triggering it Input('submit_val', 'n_clicks'). That’s why when I run the full code you gave me on PyCharm, I get an error message:

Invalid file path or buffer object type: <class ‘NoneType’>

One way to get around that is to remove the button as an input from the second callback and make the input the radioItems and the stored data like so:

@app.callback(
    Output('Table_1', 'children'),
    Input('filtered_data', 'data'),
    Input('mode_selector', 'value')
)
def update_table(data, mode):
    [...]

Does that make sense?

5

Hello, unfortunately it didn’t help. Only charts are still updated

6

can you give me more info please. What’s not working? the table is not showing for you?

7

The table is displayed. But it is not updated. I waited, assuming it would take some time, but nothing happened.
And, yes, I also sometimes got an error message when loading the table, which was solved by reloading the code cell. Now there is no such problem.

And this part doesn’t work out either

    Input('mode_selector', 'value')
8

I see. That’s because you have duplicate IDs called Table_1. The same ID is in the DataTable as well as the Div. Remove the ID from the DataTable and it will work.

data = dash_table.DataTable(
    # id='Table_1',
    [...]
)
9

It works!!! I am very grateful to you, thank you for not leaving in a difficult question for me

1 Like