分页不起作用

时间:2015-03-27 04:29:21

标签: c# asp.net-mvc kendo-ui kendo-grid kendo-asp.net-mvc

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

脚本文件按正确的顺序(jquery-1.11.2.min.jskendo.all.min.jskendo.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如下所示:

Kendo DataSourceRequest

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

Kendo DataSourceResult

2 个答案:

答案 0 :(得分:1)

嘿我尝试了你的代码,它在我的机器上工作正常。我可以在GetGridData方法中看到PazeSize = 20。

我必须做的唯一更改才能运行代码:更改为以下行:

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

为:

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

我怀疑这就是你问题的原因,就像你上面的行一样,你会得到错误的“编译时间常数不正确”,你没有得到。

我怀疑原因可能是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)
      ))

答案 1 :(得分:0)

我最后通过在read方法中添加.Type(HttpVerbs.Get)来修复它。我不知道为什么这会解决问题,因为它已经在做了Get。使用.Type(HttpVerbs.Get),它会将DataSourceRequest参数正确添加到网址。

@(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)
    )
)