ASP.NET MVC easyUI-datagrid 分页

本文写的是最简单的按照API文档来写的分页。就是插件自带的分页效果。

一、html代码：field就是代表你后台数据的对应的列名。

  <table id="dg" class="easyui-datagrid" style="width: 100%; height: 400px;" data-options="nowrap:false">

                 <thead>

                     <tr>

                         <th data-options="field:'DeviceId',checkbox:true"></th>

                         <th data-options="field:'DeviceName', width:120,align:'center'" >名称</th>

                         <th data-options="field:'DeviceUnitName', width:80,align:'center'">单位</th>

                         <th data-options="field:'MakePlace', width:120,align:'center'">产地</th>

                         <th data-options="field:'BuyTime', width:120,align:'center'">购置日期</th>

                     </tr>

                 </thead>

             </table>

二丶JS代码：在js写easyUI-datagrid读取数据时候，要分页就加上 pagination: true,pageSize:10,pageList[10,20,30],表示grid要分页，每页10条，但可选10,20或者30条每页。

 $(".easyui-datagrid").datagrid({

                 rownumbers: true,

                 singleSelect: false,

                 fitColumns: false,

                 idField: 'DeviceId',

                 method: 'post',

                 url: '/Admin/Report/DeviceDetialListSearch',

                 remoteSort: false,

                 multiSort: false,

                 pagination: true,

                 pageSize: ,

                 pageList: [,,],

                 queryParams: {

                     'DeviceIdList':"",

                 'DeviceName':$("#DeviceName").combobox('getValue'),

                 },

                 onLoadSuccess: function () {

                     //$("#dg").datagrid('clearChecked');//清除复选框

                     //$("#dg").datagrid('load');

                 }

             });

三丶Controller后台读取数据 DeviceDetialListSearch()函数: Request["rows"]代表当前页面有多少行，Request["page"]代表当前页，这两个是easyUI-datagrid自带的只要用到分页，就会有这两个，不需要顾虑。recordCount代表搜索到的数据总数，这个会在Model里求出。并可在这里调用。

 public ActionResult DeviceDetialListSearch()

         {

             FADeviceInfoModel deviceInfoModel = new FADeviceInfoModel();

             int pageSize = int.Parse(Request["rows"]);

             int nowPage = int.Parse(Request["page"]);

             int recordCount = ;  //搜索条件下的总记录数量

             DataTable  dtDeviceInfo = deviceInfoModel.SearchForDetail(pageSize, nowPage,out recordCount, Request["DeviceName"], Request["startTime"], Request["endTime"]);

             return Content(MyJson.DataTableToJsonByPage(dtDeviceInfo, recordCount, ""));

         }

四、Model里SearchForDetail()函数

  public DataTable SearchForDetail(int pageSize, int nowPage, out int recordCount,string DeviceName,  string startTime, string endTime)

         {

             string sqlCondition = " ";

             if (startTime != null && !startTime.Equals(""))

                 sqlCondition += " and FADeviceInfo.ReleaseTime >= '" + startTime + " 00:00:01' ";

             if (endTime != null && !endTime.Equals(""))

                 sqlCondition += " and FADeviceInfo.ReleaseTime <= '" + endTime + " 23:59:59' ";

             if (DeviceName != null && !DeviceName.Equals(""))

                 sqlCondition += " and (FADeviceInfo.DeviceName like '%" + DeviceName + "%' or FADeviceInfo.DeviceInputCode like '%" + DeviceName + "%')";

             string sqlOrder = " order by DeviceId desc ";

             string sqlResult = " DeviceId,DeviceStatus,DeviceCode,DeviceName,DepartmentName,DeviceSpec,DeviceUnitName,OriginalValue,MakePlace,BuyTime,FinancialCode ";

             string sqlSon = "(select top " + (nowPage - ) * pageSize + " DeviceId from FADeviceInfo " + sqlOn + " where 1 = 1 " + sqlCondition + sqlOrder + ")";

             string sql = " select top " + pageSize + sqlResult + " from FADeviceInfo  " + sqlOn + " where DeviceId not in " + sqlSon + sqlCondition + sqlOrder;

             string sqlCount = "select count(*) from FADeviceInfo " + sqlOn + " where 1 = 1 " + sqlCondition;

             DataTable dataTable = new DataTable();

             dataTable = db.MyExecuteQuery(sql);

             recordCount =db.GetCount(sqlCount);

             return dataTable;

         }

五、table转Json的函数DataTableToJsonByPage()，最下面添加Footer，如果你用不到页脚，就是统计总合计的，可以设置参数footer=“”,就OK了。

  public static string DataTableToJsonByPage(DataTable dt, int total, string footer)

         {

             StringBuilder jsonBuilder = new StringBuilder();

             //添加表格总行数

             jsonBuilder.Append("{\"total\":" + total + ",\"rows\":");

             //添加行数据

             jsonBuilder.Append("[");

             for (int i = ; i < dt.Rows.Count; i++)

             {

                 jsonBuilder.Append("{");

                 for (int j = ; j < dt.Columns.Count; j++)

                 {

                     jsonBuilder.Append("\"");

                     jsonBuilder.Append(dt.Columns[j].ColumnName);

                     jsonBuilder.Append("\":\"");

                     jsonBuilder.Append(dt.Rows[i][j].ToString());

                     jsonBuilder.Append("\",");

                 }

                 jsonBuilder.Remove(jsonBuilder.Length - , );

                 jsonBuilder.Append("},");

             }

             if (dt.Rows.Count != )

             {

                 jsonBuilder.Remove(jsonBuilder.Length - , );

             }

             jsonBuilder.Append("]");

             //添加Footer

             jsonBuilder.Append(",\"footer\":[");

             jsonBuilder.Append(footer);

             jsonBuilder.Append("]}");

             jsonBuilder = jsonBuilder.Replace("\n", "").Replace("\r", "");

             return jsonBuilder.ToString();

         }

巴特西

ASP.NET MVC easyUI-datagrid 分页

最新文章

热门文章