分页不起作用

Question

我有一个 Kendo MVC 网格，其中分页不起作用。它在单个页面中加载结果集，单击页面按钮不会执行任何操作。

脚本文件加载正确且顺序正确（jquery-1.11.2.min.js、kendo.all.min.js 和 kendo.aspnetmvc.min.js）。

我正在使用 Kendo UI 版本 2015 Q1 (2015.1.318.545)。

查看

@(Html.Kendo().Grid<MyModel>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Type);
        columns.Bound(c => c.Count);
        columns.Bound(c => c.Date);
    })
    .Filterable()
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(10)
        .PageSizes(new[] { 20, 50, 100 }))
    .DataSource(ds => ds
        .Ajax()
        .Read(r => r.Action("GetGridData", "Home", new { code = "code" }))
        .PageSize(20)
    )
)

控制器

public ActionResult GetGridData([DataSourceRequest]DataSourceRequest request, string code = "")
{
    var result = MyService.GetGridData(code);
    return Json(result.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

服务

public IQueryable<MyModel> GetGridData(string code) 
{
    using (var dbContext = new MyEntities())
    {
        return dbContext.Products.Where(w => w.Code == code)
                                 .Select(s => new MyModel {
                                     Type = s.Type,
                                     Count = s.Count,
                                     Date = s.Date
                                 });
    }
}

加载页面时，DataSourceRequest 如下所示：

没有合适的页面大小，结果是完整的数据集，如下所示：

Answer 1

嘿，我试过你的代码，它在我的机器上运行良好。我可以在 GetGridData 方法中看到 PazeSize=20。

我对运行您的代码所做的唯一更改是更改以下行：

.Read(r => r.Action("GetGridData", "Home", new { code = 'code' }))

至：

.Read(r => r.Action("GetGridData", "Home", new { code = "code" }))

但是我怀疑这会是你出现问题的原因，因为上面一行你会得到你没有得到的错误 "Bad compile time constant"。

我怀疑原因可能是 jquery 和 kendo java 脚本文件不匹配。

我建议您在示例 mvc 应用程序中取出此代码，然后尝试使用 Kendo 建议的 js 版本。例如，如果您使用的是 Kendo 2014 Q3，则：

  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="http://cdn.kendostatic.com/2014.3.1411/js/kendo.all.min.js"></script>
  <script src="http://cdn.kendostatic.com/2014.3.1411/js/kendo.aspnetmvc.min.js"></script>

以防万一如果它有助于完整查看代码Test.cshtml:

@using Kendo.Mvc.UI
@using MvcApplication16.Controllers
@model MvcApplication16.Controllers.MyModel

@{
    ViewBag.Title = "Test";
    Layout = null;
}

  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.common.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.rtl.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.default.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.dataviz.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.dataviz.default.min.css">
  <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.mobile.all.min.css">

  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="http://cdn.kendostatic.com/2014.3.1411/js/kendo.all.min.js"></script>
  <script src="http://cdn.kendostatic.com/2014.3.1411/js/kendo.aspnetmvc.min.js"></script>

@(Html.Kendo().Grid<MyModel>()
      .Name("Grid")
      .Columns(columns =>
      {
          columns.Bound(c => c.Type);
          columns.Bound(c => c.Count);
          columns.Bound(c => c.Date);
      })
      .Filterable()
      .Pageable(pageable => pageable
          .Refresh(true)
          .PageSizes(true)
          .ButtonCount(10)
          .PageSizes(new[] { 20, 50, 100 }))
      .DataSource(ds => ds
          .Ajax()
          .Read(r => r.Action("GetGridData", "Home", new { code = "code" }))
          .PageSize(20)
      ))

Answer 2

我最终通过将 .Type(HttpVerbs.Get) 添加到读取方法来修复它。我不知道为什么这会解决问题，因为它已经在执行 Get 操作了。使用 .Type(HttpVerbs.Get) 它正确地将 DataSourceRequest 参数添加到 url.

@(Html.Kendo().Grid<MyModel>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Type);
        columns.Bound(c => c.Count);
        columns.Bound(c => c.Date);
    })
    .Filterable()
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(10)
        .PageSizes(new[] { 20, 50, 100 }))
    .DataSource(ds => ds
        .Ajax()
        .Read(r => r.Action("GetGridData", "Home", new { code = "code" }).Type(HttpVerbs.Get))
        .PageSize(20)
    )
)

分页不起作用

Pagination does not work

c#

asp.net-mvc

kendo-ui

kendo-grid

kendo-asp.net-mvc