到目前为止,我已经完成了以下内容:
$(reportTableSelector).kendoGrid({
dataSource: dataSource,
sortable: false,
pageable: false,
scrollable: false,
columns: colModel
});
var grid = $(reportTableSelector).data("kendoGrid");
grid.collapseGroup(grid.tbody.find(">tr.k-grouping-row"));
$('tr[role*="row"]').hide();
如果我将最后三行代码放在click
处理程序函数中,它将有效地折叠所有分组行,但在初始化grid
后调用它时不会。
更习惯的做法
var collapseAllGroups = function (grid) {
grid.table.find(".k-grouping-row").each(function () {
grid.collapseGroup(this);
});
}
//On the grid
dataBound: function (e) {
collapseAllGroups(this);
}
当未应用分组或删除默认分组时,所选答案将导致行消失。
最好使用:
dataBound: function () {
$(reportTableSelector).find('.k-icon.k-i-collapse').trigger('click');
}
如下所示:http://jsfiddle.net/valchev/T64Kb/
(取自http://www.kendoui.com/forums/kendo-ui-web/grid/grid-collapse-exand-all-groups.aspx)
注意:我无法获得"。k-icon"。k-collapse'可以在Kendo.2013.2.716中工作,但'.k-icon. 'K-i-collapse确实有效
这是因为在初始化期间仍然没有接收到数据(您可能正在使用远程数据),因此没有呈现。
你能做的是调用collapseGroup
一旦数据被接收和绑定:
$(reportTableSelector).kendoGrid({
dataSource: dataSource,
sortable: false,
pageable: false,
scrollable: false,
columns: colModel,
dataBound: function () {
var grid = $(reportTableSelector).data("kendoGrid");
grid.collapseGroup(grid.tbody.find(">tr.k-grouping-row"));
$('tr[role*="row"]').hide();
}
});
dataBound: function (e) {
var grid = this;
$(".k-grouping-row").each(function (e) {
grid.collapseGroup(this);
});
},