Telerik MVC Grid，真正的 Ajax 自定义绑定

Question

我使用的网格看起来像这样：

 Html.Telerik().Grid(Model).Name("preciousGrid").
     ... bla bla bla..
     .ClientEvents(events => events.OnDataBinding("onDataBinding"))
     .Columns(columns =>
         {
           columns.Bound(o => o.Date);
           columns.Bound(o => o.Name);

是的，我完全忽略 .DataBinding 的东西来使用自定义 ajax 调用。为什么？我需要向服务器发送更多数据，而不是简单的 id。收集数据的唯一方法是遍历 DOM 元素。因此，Telerik 建议的所有方法都不适用于我的情况。

一切正常 - 在 onDataBinding 中，收集必要的数据并将其发送到服务器后，服务器返回结果，网格显示该数据。

但仍然有一个问题。分页不起作用。页脚显示类似的内容：

有什么想法吗？

UPD：哦...也许我应该向服务器发送寻呼信息并基于此返回结果？怎么做呢？你能给我看一个样品吗？

UPD2：默认情况下，GridCommand 命令不会将分页信息发送到服务器（如果我在 $.ajax 中省略它，并且仍然在操作方法中放置 GridCommand 参数，它会向控制器发送一些内容，但 PageSize 始终等于 10 （默认） value），并且 Page 始终为 1。所以我想我必须将这些值硬编码到 $.ajax 中，但我不知道如何在客户端上获取 PageSize 和 Page 值？

Answer 1

如果您正在进行自定义数据绑定，则必须自己处理分页和排序，如下所示。 演示网站上的示例非常合理......

[GridAction(EnableCustomBinding = true)]
public ActionResult _Index(GridCommand command)
{
    IEnumerable<MyObject> data = GetData(command.Page - 1, command.PageSize);
    int count = GetDataCount();
    return View(new GridModel { Data = data, Total = count });
}

在您看来:

.DataBinding(dataBinding => dataBinding.Ajax().Select("_Index", "Subjects"))
.Pageable(p =>
{
    p.PageSize(Model.PageSize, Model.PageSizes);
    p.Style(GridPagerStyles.PageInput | GridPagerStyles.NextPreviousAndDropDown);
})

Answer 2

好吧...显然你可以做真正的自定义ajax绑定

你必须定义数据绑定虽然它不会被网格使用，但你需要它才能使网格可分页。

 .DataBinding(binding => binding.Ajax().Select("GetList","Home")) // Although I guess you can put whatever here
                        .ClientEvents(events => events.OnDataBinding("Grid_onDataBinding"))

接下来，在 Grid_onDataBinding javascript 函数中，您必须执行类似的操作

var grid = $('#ConflictsGrid').data('tGrid');
$.ajax({ 
        url: "GetList",
        contentType: 'application/json; charset=utf-8',
        type: "GET",
        data: { 
               page: JSON.stringify({currentPage: grid.currentPage, pageSize: grid.pageSize }),
               // any other data you want to send to the server 
         },
         success: function (data) {
             grid.dataBind(data); // Here, the data that server returns will be actually bound to the grid
         },