DataTable content update with dropdown as input

Dear,
I’ve following scenario: In the dropdown, I’ve names of tables/pandas dataframes (tab1, tab2, tabx). I try to update/change the whole table based on the option.

The layout part is:

html.Div(dtab.DataTable
(id = ‘exch_table’,
columns=[{“name”: i, “id”: i} for i in df.columns],
data=df.to_dict(‘records’)
)

In the callback, I retrieve data from database:
@app.callback(Output(‘exch_table’, ‘children’),
[Input(‘exch_dropdown’, ‘value’)])

def update_table(selected_value):
df = pd.read_sql(selected_value, conn)
return df

The mistake is:
The callback for property children of component exch_table
returned a value having type DataFrame
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.

What is my issue about? How to solve it? (I tried to go through all the source however I didn’t find a similar scenario.)

Many thanks,
Vaclav

Note: Just being sure: dtab is dash_table.
import dash_table as dtab

Hi, this is my solution:
as the Das h v39 enables multiple out put (update is necessary) the layout is:
html.Div(dtab.DataTable(id = ‘exch_table’)

The call back is:
def update_table(selected_value):
df = pd.read_sql(selected_value, conn)
columns=[{“name”: i, “id”: i} for i in df.columns]
data=df.to_dict(‘records’)
return columns, data

It should work. The dash datatable is being updated based on the new pandas dataframe.

Good luck.
Vaclav

1 Like