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);

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

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

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

有什么想法吗？

UPD：哦......也许我应该发送到服务器的分页信息并根据它返回结果？怎么做？你能告诉我一个样品吗？

UPD2：GridCommand命令默认情况下不向服务器发送寻呼信息（如果我在$ .ajax中省略它并且仍然在动作方法中放置一个GridCommand参数，它会向控制器发送一些东西，但PageSize总是等于10（默认值），Page总是1.所以我想我必须在$ .ajax中硬编码包含这些值。但我不知道如何在客户端上获取PageSize和Page值？

Answer 1

如果您正在进行自定义数据绑定，则必须自己处理分页和排序，如下所示。 The example on the demo site非常合理......

[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绑定

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

 .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
         },