I'm using ag-grid
to display a table which has a Row Grouping
.
The column that I group by is invisible since its value holds no meaning.
So for example, I will have the following (fully collapsed) table:
---------------------------------
| H1 H2 H3 |
----------------------------------
| > groupId1 (1) |
----------------------------------
| > groupId2 (5) |
----------------------------------
As you see the grouping is done by user-unfriendly ID which is not reflected at all in the Column Definitions. I would like to change groupId1
/ groupId2
to a user-friendly text that is assigned dynamically according to the content of the group rows.
I am using React
.
I am using ag-Grids examples as a starting point, the following example embodies the problem I'm facing: (eg: https://plnkr.co/edit/VM59gScPD55PhX4y4JBj?p=preview)
Thanks for your time. :)
A colleague helped me at the end, his solution was:
valueFormatter: ({ value, data }) => 'something ' + value
inside the colDef of my group, and the value to be displayed as the header is sent inside 'data'.
He said that cellRenderer is an overkill for a simple task like this.