✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

Nested table columns

Hello,

I’m new to Dash, and I’m really excited about it.

Right now I’m trying to create tables with dash table experiment but i need something that i haven’t seen in any post so far, so i decided to ask.
I need to create a table with nested columns like this one:
image
Is there any way to do this ?

So far found a workaround - displaying 2 tables where the first one is only the top headers. It looks like that:
image
but it doesn’t work when you have to scroll horizontally because it scrolls only the second table.
So … is there any way to remove the scrolls from the table and show the full table in a div with overflow: auto so i can scroll the 2 tables together ?
Someone got better ideas ?

And some more additional questions:
How can i break the line i the header ? (
doesn’t work)
And is there any way to set width of a particular column, for example I need the first column to be wider ?

We’re working on multi-line headers in a new version of the interactive dash table:

We’re looking to release this table towards the end of August

2 Likes

In the new dash table, would it be possible to create merged rows like in Excel (similar to what i see here with the columns?)?

Thank you very much for the fast answer.

This is exactly what i need :slight_smile: I’m very happy that it will be implemented soon.
Big ups for Dash! It’s awesome!

Do you have suggestions on the other questions:
Can I break the line in tables’s headers ?
and
Can I set “width” for particular column ?

Yeah, both of these will be possible with the new table. Stay tuned!

1 Like

Hi, Is this feature already integrated? I have a similar use-case and would like to use nested table columns.

Thanks

Hi @neeraj_sujan, and welcome to the Dash forum!

Yes, this feature is available. See the example called “Multi-Headers” on this page https://dash.plotly.com/datatable/style