I'm trying to show some data that is grouped using ag-grid. The data is being displayed correctly, but it is not grouping the data as it should. I'm using angularJS 1.5.8 and ag-grid 12.0.2. Here is a very simplified version of what I'm trying to do:
function _setGridOptions() {
var data = [
{packageID: "one", documentID: "one-one", cost: 1},
{packageID: "one", documentID: "one-two", cost: 2},
{packageID: "one", documentID: "one-three", cost: 3},
{packageID: "two", documentID: "two-one", cost: 4},
{packageID: "two", documentID: "two-two", cost: 5},
{packageID: "two", documentID: "two-three", cost: 6}
];
var cols = [
{
headerName: "Package ID",
width: 100,
field: "packageID",
rowGroup: true
},
{
headerName: "Document ID",
width: 100,
field: "documentID"
},
{
headerName: "Cost",
width: 100,
field: "cost"
}
];
$ctrl.agGridOptions = {
columnDefs: cols,
animateRows: true,
enableRangeSelection: true,
rowData: data,
enableSorting: true,
debug: true,
enableColResize: true,
onGridReady: function () {
$ctrl.agGridOptions.api.sizeColumnsToFit();
}
};
$ctrl.transactionsLoaded = true;
}
And here is what the table looks like:
As you can see there is no "Group" column and there is no expand/collapse control by the group row.
Any ideas what I'm doing wrong?
I just realized what the issue is. The "Grouping Rows" feature is an enterprise feature and I am using the free version.