javascript 我可以更改单击 Kendo Grid 下一页按钮时触发的事件吗?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/20321474/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 18:14:26  来源:igfitidea点击:

Can i change the event that triggers when Kendo Grid next page button is clicked?

javascriptjquerykendo-uikendo-grid

提问by xTMNTxRaphaelx

I have a kendo grid with pageable true. I want to trigger a custom function with Next page in kendo grid paging is getting clicked?

我有一个可分页为真的剑道网格。我想在剑道网格分页中使用下一页触发自定义功能被点击?

采纳答案by dcodesmith

You will need to trigger a callback in the change event of the datasource bound to the grid.

您将需要在绑定到网格的数据源的更改事件中触发回调。

Fired when the data source is populated from a JavaScript array or a remote service, a data item is inserted, updated or removed, the data items are paged, sorted, filtered or grouped.

当从 JavaScript 数组或远程服务填充数据源、插入、更新或删除数据项、对数据项进行分页、排序、过滤或分组时触发。

Datasource Change Event

数据源更改事件

JS CODE

代码

Subscribe to change on initialisation

订阅更改初始化

var dataSource = new kendo.data.DataSource({
  transport: {
    read: {
      url: "http://demos.kendoui.com/service/products",
      dataType: "jsonp" //"jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  },
  change: function(e) {
    // PLACE YOUR CALLBACK CODE HERE
  }
});
dataSource.fetch();

Subscribe to change post initialisation

订阅更改后初始化

function callback(e) {
  // PLACE CALLBACK CODE HERE
}
var dataSource = new kendo.data.DataSource({
  transport: {
    read: {
      url: "http://demos.kendoui.com/service/products",
      dataType: "jsonp" //"jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  }
});
dataSource.bind("change", callback);
dataSource.fetch();

回答by Pinar Olguc

Here is what to do: Set pageable attribute with your custom object as below, and add your own change function:

操作如下:使用自定义对象设置 pageable 属性,如下所示,并添加您自己的更改功能:

<div id="grid"></div>

$("#grid").kendoGrid({
  columns: [
    { field: "productName" },
    { field: "category" }
  ],
  dataSource: [
    { productName: "Tea", category: "Beverages" },
    { productName: "Coffee", category: "Beverages" },
    { productName: "Ham", category: "Food" },
    { productName: "Bread", category: "Food" }
  ],
  pageable: {
    pageSize: 2,
    change:function(e){
         console.log("grid pager clicked!");
    }

  }
});

回答by Antony Jones

The solution dcodesmith gave your will work but as an alternative you could bind to the click event on the page links, the following jQuery selector should work:

解决方案 dcodesmith 为您提供了解决方案,但作为替代方案,您可以绑定到页面链接上的 click 事件,以下 jQuery 选择器应该可以工作:

$(".k-link.k-pager-nav")

And you can get the page it will go to using the page data attribute.

您可以使用页面数据属性获取它将转到的页面。