构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（8）

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（8）2014-08-10MVC与EasyUI DataGrid 分页

上一节我们讲了，DataGrid获取数据的一些用法，这一节讲DataGrid的分页

DataGrid将传递“当前页码”“每页条数”

控制器获取参数之后交给BLL层处理逻辑和分页，返回总页数和当前页的数据

最后交给DataGrid处理

课外：从此次前端的处理速度我看出，没有以前的JQGrid控件的处理数据快。

首先在让DataGrid支持分页，我们需要加入几个属性

是否启用分页：pagination 默认是false

每页数量：pageSize 默认10

可选择每页数量：pageList 默认[10,20,30,40,50]

排序字段：sortName 默认null

排序类型：sortOrder 默认asc

OK加入后的代码变成这样

$（function （） {$（"#List"）.datagrid（{url: "/SysSample/GetList",width: $（window）.width（） - 10,methord: "post",height: $（window）.height（） - 35,fitColumns: true,sortName: "Id",sortOrder: "desc",idField: "Id",pageSize: 15,pageList: [15, 20, 30, 40, 50],pagination: true,striped: true, //奇偶行是否区分singleSelect: true,//单选模式rownumbers: true,//行号columns: [[{ field: "Id", title: "ID", width: 80 },{ field: "Name", title: "名称", width: 120 },{ field: "Age", title: "年龄", width: 80, align: "right" },{ field: "Bir", title: "生日", width: 80, align: "right" },{ field: "Photo", title: "照片", width: 250 },{ field: "Note", title: "说明", width: 60, align: "center" },{ field: "CreateTime", title: "创建时间", width: 60, align: "center" }]]}）;}）;Index

预览一下