Is it possible to reorder a column group?

[bawaji94]

Is there a way to have the drag and drop option for the column group just like the individual columns.

[wcjordan]

It is possible, but we don't provide a drag handle for it, so you will need to add your own to your grouped header renderer and handle the reorder logic using the column props.

@quixotically may have some advice, she implemented the solution for our application. But it required sync'ing multiple grids to support grouped and non-grouped columns at the same time.

[quixotically]

Hello @bawaji94 ,
Yes, we use a separate grid for each header in our application. Because of some existing limitations of the ColumnGroups feature of FDT, we rolled our own. The way ours works is that we override some of the FDT css so that the nongrouped top header cells can span into the bottom header when needed. We render blank cells underneath in the bottom header to keep the spacing synced with the top header. Also, we only enabled the reorder handle in the top header (which includes the tall cells), which helped with not needing extra logic to support that. But it was still a pretty involved change to get a custom group header working.

[Ninjinka]

Is it possible to view how you handle it? (the example showed in the gif)

[fonpacific]

Yeah, it would be nice to see some code on how to reorder column groups.

[angeloocana]

I'm trying to implement that.
I don't have to much time, so I don't know when it will be ready.
I already started, the code is here: https://github.com/angeloocana/fixed-data-table-2/blob/master/examples/ReorderColumnGroupsExample.js

[wcjordan]

Our new reordering API should make this easier to implement. Adding v1.2 milestone so we consider this when tackling.