Slickgrid分組展開/摺疊奇怪行爲

Question

我正在使用帶分組功能的SlickGrid並獲得了一些奇怪的行爲。請致電jsFiddle。

var ReportData = { 
"cols":{ 
    "date":"Date", 
    "status":"Status", 
    "dataField":"Data field" 
}, 
"data":[ 
    {"id":0,"date":"First","status":"Accepted","dataField":"1000"}, 
    {"id":1,"date":"Second","status":"Accepted","dataField":"2000"}, 
    {"id":2,"date":"Third","status":"Accepted","dataField":"3000"}, 
    {"id":3,"date":"Fourth","status":"Accepted","dataField":"4000"}, 
    {"id":4,"date":"Fifth","status":"Accepted","dataField":"5000"}, 
    {"id":5,"date":"Sixth","status":"Canceled","dataField":"6000"}, 
    {"id":6,"date":"Seventh","status":"Canceled","dataField":"7000"}, 
    {"id":7,"date":"Eight","status":"Canceled","dataField":"8000"}, 
    {"id":8,"date":"Ninth","status":"Canceled","dataField":"9000"}, 
    {"id":9,"date":"Tenth","status":"Rejected","dataField":"1000"}, 
    {"id":10,"date":"Eleventh","status":"Rejected","dataField":"2000"}, 
    {"id":11,"date":"Twelfth","status":"Rejected","dataField":"3000"} 
] 
}; 

var options = { 
    enableCellNavigation: true, 
    editable: true, 
    autoHeight:true, 
    forceFitColumns: true, 
}; 

function groupBy() { 
dataView.setGrouping([{ 
    getter: "status", 
    aggregators: [ 
     new Slick.Data.Aggregators.Sum("dataField"), 
    ], 
    collapsed: true, 
    aggregateCollapsed: true, 
    lazyTotalsCalculation: true 
},{ 
    getter: "date", 
    aggregators: [ 
     new Slick.Data.Aggregators.Sum("dataField"), 
    ], 
    collapsed:true, 
    aggregateCollapsed: true, 
    lazyTotalsCalculation: true 
},]); 
} 
function sumTotalsFormatter (totals, columnDef) { 
var rowData = ''; 

// Get sum 
var val = totals.sum && totals.sum[columnDef.field]; 
if (val != null) { 
    rowData += "<b>" + (Math.round(parseFloat(val) * 100)/100) + "</b>"; 
} 

return rowData; 
} 

function makeGridColumns(data){ 
var that = this; 
var columns = []; 
var id = 0; 

// Parse given result for SlickGrid 
jQuery.each(data, function(label, name) { 
    var item = { 
     id:   id++, 
     field:  label, 
     name:  name, 
     focusable: false, 
     groupTotalsFormatter: sumTotalsFormatter, 
    } 

    columns.push(item); 
}); 

return columns; 
} 


$(function() { 

var groupItemMetadataProvider = new Slick.Data.GroupItemMetadataProvider(); 

dataView = new Slick.Data.DataView({ 
    groupItemMetadataProvider: groupItemMetadataProvider, 
    inlineFilters: true 
}); 

var columns = makeGridColumns(ReportData.cols); 

grid = new Slick.Grid("#myGrid", dataView, columns, options); 

// register the group item metadata provider to add expand/collapse group handlers 
grid.registerPlugin(groupItemMetadataProvider); 

// wire up model events to drive the grid 
dataView.onRowCountChanged.subscribe(function (e, args) { 
    grid.updateRowCount(); 
    grid.render(); 
}); 
dataView.onRowsChanged.subscribe(function (e, args) { 
    grid.invalidateRows(args.rows); 
    grid.render(); 
}); 


// initialize the model after all the events have been hooked up 
dataView.beginUpdate(); 

dataView.setItems(ReportData.data); 

groupBy(); 

dataView.endUpdate(); 

}) 

當點擊「接受」組和擴大，你會看到所有的選項，除了「三」，但總可以看到這個選項（在陌生的地方）。當你點擊後，例如選項「Second」，你會看到「Third」。

我試圖從頭開始創建，使用原始的SlickGrid示例，但得到了同樣的問題。

您能提供一些建議/解決方法嗎？

謝謝！

Answer 1

問題出在SlickGrid本身。我在Github找到了解決方案：https://github.com/mleibman/SlickGrid/issues/926