Ag-Grid Server Side Row Group Key Creator

Question

When using Ag-Grid's server side row model, I am unable to send a custom group key to the server in order to do proper group by queries.

My row data is a simple JSON structure but with one composite object.

row = {
    athlete: '',
    age: '',
    country: {
        name: 'Ireland',
        code: 'IRE'
    },
   ...
}

I am using the server side row model. To get the grid to display the country name is simple enough as I use the following column definition.

{
 headerName: "Country", 
 colId: "country", 
 valueGetter: "data.country.name", 
 enableRowGroup: true
}

However, when I group by the Country column ag-grid sends the groupKey as 'Ireland' from my example above. But I need the group key to be the country code, 'IRE'. I cannot figure out how to generate a groupKey when using the server-side row model.

I have seen the keyCreator method, but this only works for client-side row model. In addition, I have seen the Tree Data Mode which has a callback for getServerSideGroupKey(dataItem) but then callback only gets used when gridOptions.treeData = true and when the treeData option is set to true, a "Group" column is always displayed regardless if a grouping is happening or not. I tested this out by setting isServerSideGroup: function(dataItem) {return false;}

Any help would be appreciated.

FlatPenguin FlatPenguin · Accepted Answer · 2019-11-19T17:08:12

I was able to solve this issue by using the dot notation for the column definition's field attribute and a custom cellRenderer.

{
 headerName: "Country", 
 colId: "country", 
 field: "country.code", 
 enableRowGroup: true,
 cellRenderer: function (params) {
     return params.data.country.name;
 }
}

This allowed me to display the correct data point from the custom object and when doing server side actions, ag-grid will send the datapoint contained within the field attribute.

Ag-Grid Server Side Row Group Key Creator

1 Answers