如何实现在asp.net的MVC在客户端UI剑道网格服务器端分页 [英] How to implement Server side paging in Client side Kendo UI grid in asp.net mvc

问题描述

谁能告诉我怎样才能实现服务器端分页与客户端的UI剑道格？

解决方案

  

更新：我们有<一个href=\"http://blogs.telerik.com/kendoui/posts/14-01-02/kendo-ui-open-sources-dynamic-linq-helpers\">released一个开源.NET库，这使得分页，排序的过滤轻松了许多。

该网格将发送电流的pageSize 和跳过一旦您设置 serverPaging 到真正。在服务器端，你应该使用网页所提供的信息数据，并与项目总数一起返回。这里是一个code片断：

动作

 公众的ActionResult产品（INT的pageSize，INT跳过）
{
     使用（VAR罗斯文=新NorthwindDataContext（））
     {
        变种产品= northwind.Products;
        //获取的记录总数 - 需要分页
        VAR总= products.Count（）;        //页面的数据
        VAR数据= products.Skip（跳过）。取（pageSize的）.T​​oList（）;        //返回为JSON  - 剑道电网将使用响应
        返回JSON（新{总=总，数据=数据}）;
     }
}
 

查看

  $（＃电网）。kendoGrid（{
    数据源： {
        运输： {
            阅读：{
               网址：家/产品，
               数据类型：JSON
               键入：POST
            }
        }，
        模式：{
            数据：数据，//记录在响应的数据字段中返回
            总说：总//记录总数是在响应的总字段
        }，
        serverPaging：//真正使服务器分页
    }
}）;
 

参考

与LINQ

分页

• Take()和Skip（）

数据源配置设置

• serverPaging


• schema.data


• schema.total

Can anyone tell me how can I implement server-side paging with client-side Kendo UI Grid?

解决方案

UPDATE: We have released an open source .NET library which makes paging, sorting an filtering a lot easier.

The grid will send the current pageSize and skip once you set serverPaging to true. On the server side you should page your data using the provided info and return it together with the total number of items. Here is a code snippet:

Action

public ActionResult Products(int pageSize, int skip) 
{
     using (var northwind = new NorthwindDataContext())
     {
        var products = northwind.Products;
        // Get the total number of records - needed for paging
        var total = products.Count();

        // Page the data
        var data = products.Skip(skip).Take(pageSize).ToList();

        // Return as JSON - the Kendo Grid will use the response
        return Json(new { total = total, data = data });
     }
}

View

$("#grid").kendoGrid({
    dataSource: {
        transport: {
            read: {
               url: "home/products",
               dataType: "json",
               type: "POST"
            }
        },
        schema: {
            data: "data", // records are returned in the "data" field of the response
            total: "total" // total number of records is in the "total" field of the response
        },
        serverPaging: true // enable server paging
    }
});

Reference

Paging with LINQ

• Take() and Skip()

DataSource configuration settings

• serverPaging
• schema.data
• schema.total

这篇关于如何实现在asp.net的MVC在客户端UI剑道网格服务器端分页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！