Ag-Grid Tree Structure, change autoGroupColumn to Hide Ids

Question

I am using ag-grid to represent a tree structure. In my data each row has an Id and a parent Id and that's how the tree structure is established. Right now when I display Ag-grid it shows this extra column that is the ID of row and as I dig deeper into the tree it will show the related IDs of the children. Is there a way to hide this column? Below is the structure of the data and the gridOptions I am using:

endDate: null
path: [1, 3, 5]
id: 4
level: "a level"
parentId: 3
Name: "SomeName"
runCount: 1
runNum: 500
StatusCode: "INITIATED"
startDate: "2018-11-05 05:20"
userComment: null

The key elements are the id and the related parent id. The path defines the path to get to that element as required by AG-Grid. Below is my grid options.

this.gridOptions = {
  columnDefs: this.detailsColumnDefs,
  rowData: this.detailsRowData,
  treeData: true,
  animateRows: true,
  enableFilter: true,
  enableSorting: true,
  enableColResize: true,
  getDataPath: function(data) {
    return data.path;
  },
  getRowNodeId: function(data) {
    return data.id;
  },
  autoGroupColumnDef: {
    headerName: 'level',
    width: 250,
    hide: true,
    cellRendererParams: {
      suppressCount: true,
    }
  }
};

the autoGroupColumn displays the Id's of each row however, I want it to show the level instead. Is there a way to assign a field to this column group, I would like the level values there instead of id or just remove the id's altogether.

Ruihua Ruihua · Accepted Answer · 2019-09-11T08:34:17

You can specify 'field' to autoGroupColumnDef and let field bind to a property (i.e. level) in your data row model, and make sure leave empty value to property "level", i.e.

autoGroupColumnDef: {
    headerName: 'level',
    field: 'level',
    ......
  }

export class RowModel {
    level: string = '';
    parentId: string;
    id: string;
    ....
}

PS: It seems 'hide' doesn't have effect on group column somehow - maybe worth raising a ticket to Ag-grid Dev..

Ag-Grid Tree Structure, change autoGroupColumn to Hide Ids

1 Answers