asp.net-mvc 如何在asp.net mvc的客户端Kendo UI网格中实现服务器端分页
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12928744/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to implement Server side paging in Client side Kendo UI grid in asp.net mvc
提问by Pankaj
Can anyone tell me how can I implement server-side paging with client-side Kendo UI Grid?
谁能告诉我如何使用客户端 Kendo UI Grid 实现服务器端分页?
回答by Atanas Korchev
UPDATE: We have releasedan open source .NET library which makes paging, sorting an filtering a lot easier.
更新:我们发布了一个开源 .NET 库,它使分页、排序和过滤变得更加容易。
The grid will send the current pageSizeand skiponce you set serverPagingto 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:
网格将发送电流pageSize,skip一旦您设置serverPaging为true。在服务器端,您应该使用提供的信息分页数据并将其与项目总数一起返回。这是一个代码片段:
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
使用 LINQ 进行分页
DataSource configuration settings
数据源配置设置
回答by user7923798
To implement server pagination, correct format should be return from server. For server side paging JSON format will be something like below JSON:-
要实现服务器分页,应该从服务器返回正确的格式。对于服务器端分页 JSON 格式将类似于以下 JSON:-
{ "mytotal":1069, "mydata": [{ ProductID : 1, ProductName : "Chai"}, { ProductID : 2, ProductName : "Chang" }]}
Tell to kendo grid pick total number of records from mytotal object and data rows from mydata in schema
告诉剑道网格从模式中的 mytotal 对象和数据行中选择记录总数
schema: {
data: "mydata"
total: "mytotal" // total is returned in the "total" field of the response
}
Check detail example here
在此处查看详细示例
回答by Taersious
The accepted answer does not have a UI solution; only provides a jQuery answer. In case it helps anyone else, here is the solution that worked for our kendo grid in UI:
接受的答案没有 UI 解决方案;只提供一个 jQuery 答案。如果它对其他人有帮助,以下是适用于 UI 中剑道网格的解决方案:
code snippet of Controller
控制器代码片段
DataSourceResult result = new DataSourceResult()
{
Data = dataSet,
Total = recordCount
};
return Json(result, JsonRequestBehavior.AllowGet);
code snippet of View
视图的代码片段
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("*<our method>*", "*<our controller>*")
)

