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

【问题标题】：Show pagination and records count on both top and bottom of kendo grid在剑道网格的顶部和底部显示分页和记录数
【发布时间】：2016-04-13 07:17:15
【问题描述】：

我需要在我的剑道网格的顶部和底部显示分页和记录数。我正在使用 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，但没有分页功能，并且记录数没有更新。它只显示第一次加载的值。

有没有其他巧妙的方法可以在页面的顶部和底部显示这个？？？

【问题讨论】：

标签： jquery kendo-grid

【解决方案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 那里也有一个演示的答案

【讨论】：

【解决方案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++;
}
});

【讨论】：