Reputation: 973
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.
Upvotes: 3
Views: 3292
Reputation: 21
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..
Upvotes: 2