Can't update Dash DataTable using Pandas DataFrame.to_dict('records')

Dash Python
1

Hi,

I am trying to update a DataTable with content from an xlsx table the user uploads like this:

@app.callback(
    Output('user-input-table', 'data'),
    Input('upload-data', 'contents'),
    State('upload-data', 'filename'))
def table_upload(contents, filename):
    if contents is not None:
        content_type, content_string = contents.split(',')
        decoded = base64.b64decode(content_string)
        try:
            if 'xls' in filename:
                df = pd.read_excel(io.BytesIO(decoded),skiprows=2,engine='openpyxl')
                return df.to_dict('records')
        except:
            print('There was an error')

Unfortunately this is not working, but instead returns the following error:

dash.exceptions.InvalidCallbackReturnValue: The callback for <Output user-input-table.data>
returned a value having type list
which is not JSON serializable.

The value in question is either the only value returned,
or is in the top level of the returned list,

and has string representation
[{'Quantity': 'Exhaust mass flow', 'Unit': 'kg/h', 100: 11881.0, 85: 0, 75: 10879.0, 50: 8476.0, 25: 5774.0, 10: 4810.0}, {'Quantity': 'T after turbine', 'Unit': '°C', 100: 444.0, 85: 0, 75: 383.0, 50: 332.0, 25: 320.0, 10: 320.0}, {'Quantity': 'Engine speed', 'Unit': 'rpm', 100: 1800.0, 85: 0, 75: 1800.0, 50: 1800.0, 25: 1800.0, 10: 1800.0}, {'Quantity': 'Wastegate position', 'Unit': '%', 100: 0.0, 85: 0, 75: 0.0, 50: 0.0, 25: 0.0, 10: 0.0}, {'Quantity': 'Nox raw spec.', 'Unit': 'g/kWh', 100: 8.74, 85: 0, 75: 7.23, 50: 9.6, 25: 11.4, 10: 15.9}, {'Quantity': 'Nox req. spec.', 'Unit': 'g/kWh', 100: 1.4, 85: 0, 75: 1.4, 50: 1.4, 25: 1.4, 10: 1.4}, {'Quantity': 'Nox NTE', 'Unit': 'g/kWh', 100: 2.4, 85: 0, 75: 2.4, 50: 2.4, 25: 2.4, 10: 2.4}]

The string representation in the error message actually looks fine to me. From what I gathered online, the data input for a DataTable should be a list of dictioniaries with the column names as entries. This is exactly what I am providing here I would think.

Why does Dash say that my input is not JSON serializable?

2

Your return does look serializable, but it could be that there is something weird happening with the dtypes when you parse the excel file that throw this error (which is confusing). Your dictionaries also have some numeric keys, which should only throw an error if you try to assign numeric values to the column props in DataTable.

That’s what I would take a look into (dtypes and column types), but unfortunately it is nothing I have experienced so far in my applications…

3

Hello, did you ever resolve the issue? The same thing is happening to me