How can I upload csv data with dcc.upload and then directly show the table using dash_table with sorting/filtering function

Dash Python
1

I have read through and experimented below two sites:
https://dash.plotly.com/dash-core-components/upload

https://dash.plotly.com/datatable/callbacks

However, it’s kind of hard to combine both to be able to upload a dataset and then the table contents will pop up in dash table with sorting/filtering function as listed in the second link above.

Can anyone help with a minimal example? Thanks!

2

Hi @sound118 welcome to the forum! Why is it hard exactly? You can write a callback taking

  • as Input, the contents of the Upload component
  • as Outputs, the columns and data properties of the table, and also a dcc.Store to store the whole dataframe so that you can have this Store component as State in the filtering callback if you need a custom filter.

Side remark: do you require custom filtering and/or paging, or could you use the built-in filters of the datatable like https://dash.plotly.com/datatable/interactivity?

4

Hi @Emmanuelle, thanks for your hint. I have resolve the problem by writing a callback with two outputs with component properties as “data”, ‘columns’ respectively. Features like sorting/filtering and pagination are done by learning from Dash_table official documents.

1 Like
5

Hi,
Your suggestion really helped me. Spent so many days and nights to just figure out how to do this.
Big thumbs-up to you. :+1: