How to update autoGroupColumnDef property of ag-Grid after table is initialized

I have an ag-grid table (Enterprise version: 22.1.0) which is grouped using autoGroupColumnDef property. The grouping is dependent on the table’s data and the data loads on a button click. I need to update the autoGroupColumnDef property’s field name (_this.colName in the below code) after the page is loaded, right before loading the data.

Table’s grid options:

_this.gridOptions = {
  defaultColDef: {
      sortable: true,
      resizable: true,
      filter: true
  },
  columnDefs: _this.columnDefs,
  rowData: [],
  enableRangeSelection: true,
  autoGroupColumnDef: {
    headerName: "Sector",
    field: _this.colName,
    cellRendererParams: {
      suppressCount: true
    },
    tooltipValueGetter: function(params) {
      return _this.tooltipVal
    }
  },
  suppressAggFuncInHeader: true, 
  enableBrowserTooltips: true
};

I update the variable _this.colName before setting data to the grid. I have tried the following options and none of them worked for me:

  1. _this.gridOptions.api.refreshClientSideRowModel('group');
  2. _this.gridOptions.api.refreshCells();
  3. _this.gridOptions.autoGroupColumnDef.field = 'Column's Name'

Any help would be appreciated!

Answer

I contacted ag-grid support and apparently this is a bug and they have it in their backlog with no ETA available for now. A workaround they provided was to use: https://www.ag-grid.com/javascript-grid-grouping/#showRowGroup.

This is not really a good workaround because the grouped columns are separated and makes the page feel cramped. Also there are some look and feel issues that keep popping up (Eg: empty space added before each column that increases with each grouped column. ie second column has 1 cm added before it, third column has 2 cm added before it and so on. I guess this was added to bring the grouped look in the group column but you wouldn’t expect this behavior when the columns are separated.)

ag-grid’s backlog ID for the ticket: AG-3359 – Allow the autoGroupColumn to be used in the API calls for columns, at the moment there is no way to dynamically change it after creation. (ie, setColumnDefs …)

Link to track the progress: https://www.ag-grid.com/ag-grid-pipeline/