easyui datagrid分页

datagrid分页设置 pagination="true" 貌似是不行的！  只是显示分页工具栏 没有达到分页效果  

前端

$(function (){       
        
        var p = $('#dgVehicle').datagrid().datagrid('getPager');        
        p.pagination({
            pageSize: 20,
            pageList:[10,20,30,40,50],
            beforePageText: '第',
            afterPageText:'共{pages}页',
            displayMsg: '当前显示 {from} 到 {to} ,共{total}记录'

            //onBeforeRefresh: function () {
            //    alert('before refresh');
            //},
            //onRefresh: function (pageNumber, pageSize) {
            //    alert(pageNumber);
            //    alert(pageSize);
            //},
            //onChangePageSize: function () {
            //    alert('pagesize changed');
            //},
            //onSelectPage: function (pageNumber, pageSize) {
            //    alert(pageNumber);
            //    alert(pageSize);
            //}
        });

<div id="tb" style="padding: 2px; height: auto">
    <div>
        @*<a href="javascript:void(0)" onclick="cre('@Url.Action("VeCreate")')" class="easyui-linkbutton" iconcls="icon-add" plain="true">添加</a>*@
        <a href="javascript:void(0)" onclick="mod('@Url.Action("VeEdit")')" class="easyui-linkbutton" iconcls="icon-edit" plain="true">修改</a>
        <a href="javascript:void(0)" onclick="del('@Url.Action("VeDelete")')" class="easyui-linkbutton" iconcls="icon-remove" plain="true">删除</a>
        <a id="btnSel" href="javascript:void(0)" onclick="sel()" class="easyui-linkbutton" iconcls="icon-search" plain="true">查询</a>
    </div>
</div>
<table id="dgVehicle" class="easyui-datagrid" data-options="singleSelect:true,toolbar:'#tb',fit:true,fitColumns:true" title="车辆信息"
       rownumbers="true" pagination="true"  url="@Url.Action("VehicleData")">

    <thead>
        <tr>
            <th data-options="field:'strVehicleModel'">
                车辆型号
            </th>
            <th data-options="field:'strBatchNo'">
                车辆批次
            </th>
            <th data-options="field:'strVIN'">
                VIN码
            </th>

            <th data-options="field:'strEngineModel'">
                发动机型号
            </th>
            <th data-options="field:'strEngineNo'">
                发动机编号
            </th>
            <th data-options="field:'strEngineMaker'">
                发动机制造商
            </th>
            <th data-options="field:'strEngineLineage'">
                发动机系族
            </th>
            <th data-options="field:'strEngineAddress'">
                发动机生产厂地址
            </th>
            <th data-options="field:'strBrand'">
                发动机厂牌
            </th>
            <th data-options="field:'strStatus'">
                状态
            </th>
        </tr>
    </thead>
</table>

前端通过get方式获得 json的数据 解析绑定到datagrid上 后端只用实现controller中的action就行        

//这里的rows page是自动的 不用去写 直接获得就能得到当前的数据 rows是pagesize page是第几页　　
//只要代码写的没问题，easyui下面的分页插件中,比如选择每页显示多少行和上一页、下一页事件是自动触发的。
//page和rows也是esyui每次自动传到后台的，不需要自己手写

int rows = Request["rows"] == null ? 10 : int.Parse(Request["rows"]);
int page = Request["page"] == null ? 1 : int.Parse(Request["page"]);
List<VehicleModel> lst = new List<VehicleModel>();
var array = Fquery.ToArray();
for (int i = (page - 1) * rows; i < page * rows && i < array.Length; i++)
{
lst.Add(array[i]);
}

//最重要的是在后台取数据放在json中要添加个参数total来存放数据的总行数，如果没有这个参数则不能分页
int total = array.Length;

var result = new { total = total, rows = lst };

return Json(result);

 

　　效果已出