CODEWITHSUNDEEP
ag-grid
Arseni Mourzenko
Arseni Mourzenko

Reputation: 52331

How to customize a grouping value in ag-grid for a specific column?

I have an ag-grid enterprise component showing a list such as this:

Column 1  Column 2  Column 3
--------  --------  ----------
ABC123    4         Category 1
ABC456    5         Category 2
DEF789    1         Category 1
DEF012    8         Category 3

When the user choses to group the results by Column 1, I want ag-grid to use only the first three letters in order to perform the grouping, and not the full values:

   Column 1  Column 2  Column 3
   --------  --------  ----------
> ABC
   ABC123    4         Category 1
   ABC456    5         Category 2
> DEF
   DEF789    1         Category 1
   DEF012    8         Category 3

How do I do that?

From what I understand, group cell renderer only affects the way groups are displayed, but doesn't change the actual values of the groups.

Upvotes: 1

Views: 456

Answers (1)

Arseni Mourzenko
Arseni Mourzenko

Reputation: 52331

Found it. I can use keyCreator to do exactly that:

const colDef = [
    {
        headerName: 'Column 1',
        ...
        rowGroup: true,
        keyCreator: p => p.value.substr(0, 3)
    },
    ...
]

Upvotes: 1

Related Questions