如何获得剑道网格页面更改选项

Question

我已经为我的web api完成了kendo UI grid (angularJs版本)的设置。我包含了服务器侧分页。它为每个页面更改请求发送take, skip, page和pageSize选项。

在这里，我想在api中创建自己的搜索模型，将这些值绑定到JS对象，然后将数据发布到服务器。

我想知道我是否能得到与网格相关的事件值:页面更改，pageSize。

我要发送的自定义数据字段:'

    public class SearchModel 
{
    ....
    .......
    public int PageNo { get; set; }
    public int PageSize { get; set; }
    public string SortOrder { get; set; }
    public string SortColumn { get; set; }
}

因此需要填充服务器端的这些指定字段。为此，可以在JS中使用这些相同的字段制作对象，并且应该从网格分页事件填充值。比如pageNo和page Size

Answer 1

看看这个。

var grid = $('#test_grid').data('kendoGrid');
var pager = grid.pager;
pager.bind('change', test_pagechange);
function test_pagechange(e){
   console.log(e);
}

你也可以试试这个

当页面更改时触发

dataBound事件。您可以使用网格数据源的page()方法获得当前页面索引。

$("#grid").data("kendoGrid").dataSource.page();

也可以查看文档http://docs.telerik.com/kendo-ui/api/javascript/ui/pager#events-change

Answer 2

通常，您可以使用datasource .transport.read.data配置(http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-transport.read.data)将您的值添加到剑道数据源参数中，而不是提取数据源参数并添加您的值。

看看这个例子http://dojo.telerik.com/@Stephen/uXAjU。这是一个修改的剑道网格演示，用于远程数据绑定。

我只是添加了一个read。数据配置数据源的传输配置:

transport: {
    read: {
      url: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Orders",
      data: customData
    }
}

customData所在位置(这是您将从搜索模型中添加参数的位置):

function customData() {
    return {
        custom1: 1,
        custom2: "Two",
        custom3: new Date()
    };
}

现在，每当网格查询远程服务时，除了自定义transport.read.data方法返回的数据外，它还传递数据源功能中内置的参数，即分页/过滤/分组参数。查看一下dev tools network选项卡，可以看到customData被附加到网格/数据源读取请求中。