Question

我需要在我的Kendo Grid的顶部和底部显示分页和记录计数。我正在使用jQuery KendoGrid。

当前网格包含分页|每页记录下拉列表|和记录计数，在网格的底部。我想在网格顶部显示分页和记录数。

我尝试了什么

我尝试这样的事情。在数据绑定事件中，我尝试克隆底部div并将其附加到网格顶部。

        var grid = $("#grid");
        var topBar = grid.find(".k-grid-pager").clone();
        topBar.find('span.k-pager-sizes').remove();
        topBar.find('a.k-pager-refresh').remove();
        topBar.insertBefore(grid.children(".k-grouping-header"));

问题

底部div在网格顶部重新创建，但分页功能不存在，并且记录计数未更新。它仅显示第一次加载时的值。

还有其他简洁的方法可以在页面的顶部和底部显示这个吗？

Answer 1

不，没有，有几种解决方法，但都涉及自定义css / jquery更改。

您可以在此处查看：http://www.kendoui.com/forums/ui/grid/location-of-pagination-numbers.aspx 或者kendoui:grid - set pager on top and bottom of the grid这里答案中还有一个演示

Answer 2

我像这样实施

//Add pager and records count to grid top START
bindPagingToGridTop = function (grid, needRefresh) {
var pager = grid.find(grid.children(".k-grid-header")).before("<div id='divGridTopPager' class='k-pager-wrap k-grid-pager'></div>");

pager = $("#divGridTopPager").kendoPager({
    dataSource: grid.data("kendoGrid").dataSource,
    refresh: needRefresh ? true : false,
    buttonCount: 5
});
}
//Add pager and records count to grid top END

我在网格的数据绑定中调用它。（第一次网格加载时调用它）

 var dataBoundCallCount = 0;
 $("#myGridID").kendoGrid({
 dataBound: function (e) {
  if (dataBoundCallCount == 0) {
       bindPagingToGridTop($("#myGridID"), false);
  }
  dataBoundCallCount++;
}
});

在剑道网格的顶部和底部显示分页和记录计数

2 个答案: