Merged table cells with OData Grid

Merged table cells with OData Grid

Posted by: paulr on 2 February 2021, 10:15 am EST

• 

  paulr

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 2 February 2021, 10:15 am EST - Updated 3 October 2022, 2:34 pm EST

  I have a simple OData FlexGrid which fetches data over an OData endpoint on the backend and displays the columns. Here is an example list of columns returned by the backend:

  • Country
  • Old Amount 1
  • New Amount 1
  • Old Amount 2
  • New Amount 2

  Notice the Old/New pairs of columns. I would like to be able to customize the grid to merge cells and display Old/New grouped under same cell like this:

  

  781×275 14.7 KB

  I took a look at an example (https://www.grapecity.com/wijmo/demos/Grid/Merging/HeaderMerging/react) but it works with predefined data so when I call grid.getColumn(index) in initializeGrid method, the columns are not defined yet.

  I’m using React. How can I accomplish cell merging with OData driven FlexGrid?

  Thanks

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 3 February 2021, 3:34 am EST

  Hi Paul,

  If you wish to merge columns, you will need to define them manually. But there is an easier way to add merging than the above sample. You can use columnGroups property to define hierarchical columns and the grid will automatically merge them accordingly:

  https://www.grapecity.com/wijmo/demos/Grid/Columns/ColumnGroups/react

  Regards,
  
  Ashwin

• 

  paulr

  • Post Options:
  • Link
    Copy

  Posted 5 February 2021, 10:59 am EST

  Hi Ashwin,

  Thanks. That works but it causes an issue when using columnLayout. Whenever I restore the grid state by setting flexGrid.columnLayout, it appears to ignore the grouped columns and the grid is displayed as if columnGroups were not set. What do you recommend?

  Thanks,
  
  Paul

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 9 February 2021, 7:50 am EST

  Hi Paul,

  This is a design limitation.

  The columnLayout property only handles regular columns. The columnGroups property creates extra “logical” columns that are not taken into account by the columnLayout property.

  We may add support for this future release but we will not be able to provide any ETA on this.

  Regards,
  
  Ashwin