使用 ag-grid 对数据进行分组

Posted 2023-04-14

【中文标题】使用 ag-grid 对数据进行分组

【英文标题】：Agroup data using ag-grid

【发布时间】：2017-10-05 20:58:44

【问题描述】：

我目前在我的项目中使用 ag-grid。我正在尝试使用 agrouping 功能对数据进行分组。

在我的 col def 我有这个：

headerName: "Parent", field: "ParentID",width: 120,rowGroup:true,
headerName: "Name", field: "Name",
headerName: "Level", field: "Level",
headerName: "Active", field: "Active",
headerName: "Actions",
     field: "Actions",
     cellRenderer: function (params)   
         /*Generate a link and return it*/
         return EditLink;
     
    

然后，ag-grid 选项：

var gridOptions = 
    columnDefs: columnDefs,
    rowData: rowData,
    onGridReady: function () 
        gridOptions.api.sizeColumnsToFit();
    ,
    animateRows: true,
    enableRangeSelection: true,
    enableSorting: true,
    enableFilter: true,
    enableColResize: true,
    domLayout:'autoHeight',
    rowHeight: 48,
    enableStatusBar: true,
    rowSelection: 'single',
    groupMultiAutoColumn:true,
    groupRemoveSingleChildren:true,
    icons: 
        checkboxChecked: '<img src="data:image/png;base64,SOMECODEHERE"/>'
    
;

但是，我没有得到预期的行为，我用数据和列呈现了表格以对数据进行分组，但它没有分组，就像有序但我没有看到下拉子项的按钮

【参考方案1】：

您确定 ParentID 在多行之间共享吗？如果没有共享 id，groupRemoveSingleChildren 选项将不显示任何组。

您也可以尝试使用 rowGroupIndex 而不是 rowGroup

即

this.columnDefs = [
    headerName: "Clan", field: "clan", editable: true, rowGroupIndex: 0 ,

rowGroupIndex 允许定义子组，以便您可以嵌套组（如果需要）。

我还建议删除 groupRemoveSingleChildren 以查看您是否获得了复选框或数据是否有问题..