我如何使一个分组的剑道网格可折叠默认情况下



到目前为止,我已经完成了以下内容:

 $(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);
        });
    },

最新更新