需求:
通过Html代码 用DataGrid显示数据(分页)及数据格式化
界面效果:
View Code:
@{ Layout = "_Master"; ViewData["Title"] = "首件检验配置--列表"; /* Create by Snow 2020/08/20 DataGrid001 Html版查询 + 数据格式化(formatter) */ } <div id="cc" class="easyui-layout" style="width:100%;height:100%;" fit="true"> <div data-options="region:‘north‘,title:‘Searching‘,iconCls:‘icon-search‘" style="height:65px;"> <table > <tr> <td>订单号:</td> <td><input type="text" id="orderId" class="easyui-textbox" /></td> <td> <a href="#" class="easyui-linkbutton" data-options="iconCls:‘icon-search‘" onclick="Search()">查 询</a> </td> </tr> </table> </div> <div data-options="region:‘center‘,title:‘List‘,iconCls:‘icon-sum‘"> <table id="dg" class="easyui-datagrid" url="/FirstCheck/GetRecordList" iconCls="icon-save" rownumbers="true" pagination="true"> <thead> <tr> <th field="orderId" width="80">订单号</th> <th field="specId" width="100" formatter="SetSpec">工序</th> <th field="sn" width="150">条码</th> <th field="result" width="100" >测试结果</th> <th field="troubleId" width="100">故障代码</th> <th field="creator" width="100">创建人</th> <th field="createTime" width="150">创建日期</th> </tr> </thead> </table> </div> </div> <script type="text/javascript"> function Search() { $(‘#dg‘).datagrid(‘load‘,{ orderId: $(‘#orderId‘).val() }); } function SetSpec(val, row, index) { if (row.procedure) { return row.procedure.name; } else { return value; } } </script>
Controller:注意json对象里必须有Total,rows两字段
/// <summary> /// 检验记录列表 入口 /// </summary> /// <returns></returns> public IActionResult RecordList() { return View(); } public IActionResult GetRecordList(string orderId, int page, int rows) { try { IList<FirstCheckRecord> firstCheckRecordList = new List<FirstCheckRecord>(); FirstCheckRecordBLL bll = new FirstCheckRecordBLL(); int intTotal; firstCheckRecordList = bll.GetPageList(orderId, rows, page, out intTotal); var result = new { total = intTotal, rows = firstCheckRecordList }; return Json(result); } catch (Exception ex) { throw ex; } }
Data.dll (数据层,BLL层就不贴了)
public IList<FirstCheckRecord> GetPageList(string orderId, int pageSize, int pageIndex, out int total) { var query = this.dbEntity.AsQueryable(); if (!string.IsNullOrEmpty(orderId)) { query = query.Where(p => p.OrderId == orderId); } query = query.Include(c => c.Procedure); total = query.Count(); return query.Skip(pageSize * (pageIndex - 1)).Take(pageSize).ToList(); }