Kendo,如何使用mvc4 helper进行网格服务器分页

qin*_*126 3 asp.net-mvc kendo-ui

我正在使用mvc4.在我的一个页面上,它有Kendo Grid.我想每页显示5行.使用纯javascript我没有问题,但是,如果我使用的是mvc helper.我迷路了,在网上找不到任何样品.

这是我的javascript代码.

        <script language="javascript" type="text/javascript">

            $(document).ready(function () {
                $("#grid").kendoGrid({
                    dataSource: {
                        type: "json",
                        serverPaging: true,
                        pageSize: 5,
                        transport: { read: { url: "Products/GetAll", dataType: "json"} },
                        schema: { data: "Products", total: "TotalCount" }
                    },
                    height: 400,
                    pageable: true,
                    columns: [
                            { field: "ProductId", title: "ProductId" },
                            { field: "ProductType", title: "ProductType" },
                            { field: "Name", title: "Name" },
                            { field: "Created", title: "Created" }
                        ],
                    dataBound: function () {
                        this.expandRow(this.tbody.find("tr.k-master-row").first());
                    }
                });
            });
Run Code Online (Sandbox Code Playgroud)

现在如果我正在使用mvc helper

            @(Html.Kendo().Grid(Model)
                .Name("Grid")  //please help me to finish the rest
Run Code Online (Sandbox Code Playgroud)

更新:

添加动作代码.

    [HttpPost]
    public ActionResult GetAll([DataSourceRequest]DataSourceRequest request, int id)
    {
        var products= ProductService.GetAll(id);

        return Json(products.ToDataSourceResult(request));
    }
Run Code Online (Sandbox Code Playgroud)

服务层中的GetAll方法:

    public IQueryable<Product> GetAll(int id)
    {
        var products= ProductRepository.Get(p => p.Id== id && p.IsActive == true, null, "ProductionYear")
                    .OrderBy(o => o.Name); //.ToList();

        return Product.Select(p => new ProductVM()
        {
            Name = p.Name,
            ProductionYear= p.ProductionYear.Year.ToString()
            Id = p.Id
        }).AsQueryable();
    }
Run Code Online (Sandbox Code Playgroud)

现在,如果我运行应用程序,我将收到以下错误:

"LINQ to Entities无法识别方法'System.String ToString()'方法,并且此方法无法转换为商店表达式."}

在GetAll方法中,我注释掉了"ToList()".如果我使用ToList,一切正常.但我会回复所有行,而不是那个页面所需的那些行.

nem*_*esv 5

您可以PageSizeDataSource方法中设置内部.所以你需要这样的东西:

@(Html.Kendo().Grid(Model)
     .Name("Grid") 
     .DataSource(dataSource => dataSource.Ajax()
                                    .PageSize(5)
                                    .Read(c => c.Action("GetAll", "Products")
                                    .Model(s => s.Id(m => m.Id)))
     .Columns(columns =>
     {
        columns.Bound(m => m.ProductId).Title("ProductId");
        //other colums
     })
    .Events(g => g.DataBound("somefunction"))
    .Pageable(true))
Run Code Online (Sandbox Code Playgroud)

您可以在KendoUI Grid的Asp.NET MVC包装器文档中找到更多信息.


Uma*_*aja 5

如果您没有使用Kendo的ASP.NET MVC包装器并直接使用Kendo JavaScript对象您正在尝试进行服务器端分页,那么您需要创建数据源,如下所示:

var dataSource = {
    "type":"aspnetmvc-ajax",
    "serverSorting": true,
    "serverPaging": true,
    "page": 1,
    "pageSize": 8,
    "schema": {
      "data":"items",
      "total":"count",
      "errors":"errors"
    }
};
Run Code Online (Sandbox Code Playgroud)

你的Read控制器方法看起来像:

    public ActionResult List_Read([DataSourceRequest]DataSourceRequest request) {
        try {
            var model = null /* prepare your model object here contain one page of grid data */;

            // using Json.NET here to serialize the model to string matching the
            // schema expected by the data source
            var content = JsonConvert.SerializeObject(new { count = model.Count, items = model.Items }, Formatting.None);

            return Content(content, "application/json");
        }
        catch (Exception exception) {
            // log exception if you need to

            var content = JsonConvert.SerializeObject(new { errors = exception.Message.ToString() }, Formatting.None);

            return Content(content, "application/json");
        }
    }
Run Code Online (Sandbox Code Playgroud)

type,serverSortingserverPaging确保在服务器端进行分页和排序非常重要.type 必须aspnetmvc-ajax,否则查询数据将不会被Read方法中[DataSourceRequest]属性指定的模型绑定器识别.除非要编写自己的自定义模型绑定器来解析由kendo dataSource发送的查询数据,否则不能省略该属性,这不符合ASP.NET MVC中DefaultModelBinder使用的模型绑定约定.