将网格pageSize设置为Kendo UI中的变量

时间:2013-12-16 05:37:22

标签: javascript jquery telerik kendo-ui kendo-grid

使用Kendo UI网格构建列表。尝试设置kendo.data.DataSource对象的pageSize参数。

我最初可以将pageSize设置为变量(例如varPageSize = 20)。我可以通过单击按钮来增加varPageSize变量(例如varPageSize + = 10)。但是,网格的pageSize不会更新。

变量赋值:

var varPageSize = 20;

网格的部分代码:

dataSource = new kendo.data.DataSource({
     pageSize: varPageSize,
     ...
});

点击事件处理程序的代码

$('#moreButton').on('click', function () {
      varPageSize += 10;

      //print to the console to monitor the value of the varPageSize variable
      console.log(varPageSize);
});

我的问题是我应该如何实现对pageSize参数的变量赋值,以便可以更新它以响应前端事件。

我最初的想法是在更新变量值后我没有更新网格。来自Telerik的Kendo UI论坛帖子说要使用grid.refresh(); - 但是网格对象无法识别.refresh()。我也在寻找关于这个主题的其他问题,我很难确定将哪一个转换为我的解决方案 - 每个现有帖子都是我不使用的变体(例如.pageSize();)

赞赏任何洞察或推动正确的方向。

谢谢!

1 个答案:

答案 0 :(得分:5)

设置pageSize: varPageSize时,您将在执行时分配varPageSize的不可变值。您没有为varPageSize分配引用。因此,当您更改pageSize时,varPageSize将不会更新(这是JavaScript的工作方式,而不是特定于Kendo UI的方式)。

为了做您想做的事情,您需要在更改后调用dataSource.pageSize(varPageSize),然后grid.refresh()将此更改应用于网格。

有关示例,请参阅this fiddle