easyui的datagrid分页写法小结

easyui的datagrid分页死活不起作用...沙雕了...不说了上代码

 //关闭tab1打开tab2 查询Detail
     function refundDetail(){
         $('#tt').tabs('select', "Detail Information");//subtitle为选项卡的标题
         //发起ajax请求,查询退款detail
         var dayendDate = $("#dayendDate").val();
         var terminal = $("#terminal").val();
         var counter = $("#counter").val();

         var txnType = 99;

         $('#detailCollectionInfo').datagrid({
             url: "dayendReconController.do?dayendReconDetail",
             queryParams: {
                 txnType:txnType,//交易类型
                 dayendDate:dayendDate,
                 terminal:terminal,
                 counter:counter
             }
         });

         //下拉框值
         $("#txnType").val('03');//txnType和点击保持一致,payMode为All不单独设置

 //        $.ajax({
 //            type: "post",
 //            url: "dayendReconController.do?dayendReconDetail",
 //            data: {
 //                dayendDate:dayendDate,
 //                terminal:terminal,
 //                counter:counter
 //            },
 //            dataType: "json",
 //            success: function(data){
 //                console.log(data);
 //                var detail = data.detail;
 //                $("#detailCollectionInfo").datagrid("loadData",detail.rows);
 //            }
 //        })

     }

没错, 注释掉的沙雕代码就是我之前错误的写法, 发起ajax请求后台肯定接收不到page和rows两个参数, 分页必然不起作用.上面的写法datagrid自动将page和rows参数传到了后台, 每点击一次下一页发起当页的数据请求.以下是部分主要代码做个记录:

======================================我是分割线=======================================

jsp:

 <table id="detailCollectionInfo" title="" class="easyui-datagrid"
                                        style="width:100%;height:100%" overflow="hidden"
                                        toolbar="#toolbar" pagination="true" rownumbers="true"
                                        fitColumns="false" singleSelect="true" fit="true"
                                        pagesize="10" pageNumber="1" pageList="[10]" >
                                     <thead>
                                     <tr>
                                         <th align="center" field="id" width="50">ID</th>
                                         <th align="center" field="refNo" width="110">Reference Number</th>
                                         <th align="center" field="accNo" width="110">Account Number</th>
                                         <th align="center" field="txnDate" width="110">Transaction Date</th>
                                         <th align="center" field="amount" width="100">Amount(SGD)</th>
                                         <th align="center" field="center" width="100">Center</th>
                                         <th align="center" field="counter" width="100">Counter</th>
                                         <th align="center" field="payMode" width="100">Payment Mode</th>
                                         <th align="center" field="txnType" width="110">Transaction Type</th>
                                         <th align="center" field="cashierId" width="100">Cashier</th>
                                         <th align="center" field="operation" width="100" data-options="field:'_operate',width:80,align:'center',formatter:formatOper">Operation</th>
                                     </tr>
                                     </thead>
                                 </table>

jsp的js部分:

 $('#detailCollectionInfo').datagrid({
             url: "dayendReconController.do?dayendReconDetail",
             queryParams: {
                 txnType:txnType,//交易类型
                 dayendDate:dayendDate,
                 terminal:terminal,
                 counter:counter
             }
         });

controller:

     //查询detail
     @RequestMapping(params = "dayendReconDetail")
     @ResponseBody
     public void dayendReconDetail(HttpServletRequest request, HttpServletResponse response, DataGrid dataGrid) {
         int page = Integer.valueOf(request.getParameter("page"));
         int rows = Integer.valueOf(request.getParameter("rows"));
         JSONObject detailJsonObject = this.dayendReconService.getDayendDetail(request, response, page, rows);
 //        Map<String, Object> resultmap = new HashMap<>();
 //
 //        resultmap.put("detail",detailJsonObject);
 //
 //        return resultmap;
         Db2Page.responseDatagrid(response,detailJsonObject);
     }

serviceImpl:

 //detail-tab2
     @Override
     public JSONObject getDayendDetail(HttpServletRequest request, HttpServletResponse response, int page, int rows) {
         Map<String, Object> returnMap = dayendReconDao.getDayendDetail(request, response, page, rows);
         String jsonStr = JSONUtils.beanToJson(returnMap);
         JSONObject jsonObject = JSONObject.parseObject(jsonStr);

         return jsonObject;
     }

daoImpl:

 //查询dayend的detail
     @Override
     public Map<String, Object> getDayendDetail(HttpServletRequest request, HttpServletResponse response, int page, int rows){
         StringBuilder sql1 = new StringBuilder(
                " SELECT " +
                " id, refNo, accNo, txnDate, amount, center, counter, payMode, txnType, cashier " +
                " FROM " +
                " ( ( " +
                "     SELECT " +
                "     sp.id AS id, " +
                "     sp.ref_no AS refNo, " +
                "     sp.acc_no AS accNo, " +
                "     sp.txn_date AS txnDate, " +
                "     sp.topup_amt AS amount, " +
                "     sp.tmnl_code AS center, " +
                "     sp.counter_id AS counter, " +
                "     sp.pay_mode AS payMode, " +
                "     sp.txn_status AS txnType, " +
                "     sp.cashier_id AS cashier " +
                "     FROM " +
                "     SP_TOPUP_REC sp " +
                "     WHERE " +
                "     1 = 1 "
         );

         StringBuilder sql2 = new StringBuilder(
                " ) UNION ALL ( SELECT " +
                " re.ID AS id, " +
                " '--' AS refNo, " +
                " re.acc_no AS accNo, " +
                " re.appr_time AS txnDate, " +
                " re.refund_amt AS amount, " +
                " re.tmnl_code AS center, " +
                " re.counter_id AS counter, " +
                " re.pay_mode AS payMode, " +
                " '99' AS txnType, " +
                " re.apply_id AS cashier " +
                " FROM " +
                " REFUND_REC re " +
                " WHERE " +
                " re.appr_status = '02'  "
         );

         StringBuilder sql3 = new StringBuilder(" ) ) result ");

         StringBuilder condition = new StringBuilder();
         StringBuilder condition2 = new StringBuilder();
         List params = new ArrayList();
         List params2 = new ArrayList();

         //查询条件
         //time
         String dayendDate = request.getParameter("dayendDate");
         if(!"".equals(dayendDate)){
             condition.append(" AND DateDiff(dd, sp.txn_date, ? ) = 0 ");
             condition2.append(" AND DateDiff(dd, re.appr_time, ? ) = 0 ");
             params.add(dayendDate);
             params2.add(dayendDate);
         }
         //counter
         String terminal = request.getParameter("terminal");
         if(!"".equals(terminal)){
             condition.append(" AND sp.tmnl_code = ? ");
             condition2.append(" AND re.tmnl_code = ? ");
             params.add(terminal);
             params2.add(terminal);
         }
         //center
         String counter = request.getParameter("counter");
         if(!"".equals(counter)){
             condition.append(" AND sp.counter_id = ? ");
             condition2.append(" AND re.counter_id = ? ");
             params.add(counter);
             params2.add(counter);
         }

         String sqlQuery = sql1.append(condition).append(sql2).append(condition2).append(sql3).toString();
         Query q = getSession().createSQLQuery(sqlQuery);
         if (params != null && params.size() > 0) {
             for (int i = 0; i < params.size(); i++) {
                 q.setParameter(i, params.get(i));
             }
         }
         if (params2 != null && params2.size() > 0) {
             for (int i = 0; i < params2.size(); i++) {
                 q.setParameter(i+params.size(), params.get(i));
             }
         }

         List objectList = q.list();
         int count = 0;
         if (objectList!=null&&objectList.size()>0){
             count = objectList.size();
         }
         q.setFirstResult((page - 1) * rows).setMaxResults(rows);

         List list = q.list();
         List<Map<String, Object>> mapList = new ArrayList<>();

         //遍历
         if(list != null && list.size() > 0) {
             for (int i = 0; i < list.size(); i++) {
                 Object[] objects = (Object[]) list.get(i);
                 Map<String, Object> map = new HashMap<>();
                 map.put("id", objects[0] != null ? objects[0] : "");
                 map.put("refNo", objects[1] != null ? objects[1] : "");
                 map.put("accNo", objects[2] != null ? objects[2] : "");
                 map.put("txnDate", objects[3] != null ? objects[3] : "");
                 map.put("amount", objects[4] != null ? objects[4] : "");
                 map.put("center", objects[5] != null ? objects[5] : "");
                 map.put("counter", objects[6] != null ? objects[6] : "");
                 map.put("payMode", objects[7] != null ? objects[7] : "");
                 map.put("txnType", objects[8] != null ? objects[8] : "");
                 map.put("cashierId", objects[9] != null ? objects[9] : "");

                 mapList.add(map);
             }
         }

         Map<String, Object> returnMap = new HashMap<>();
         returnMap.put("total",count);
         returnMap.put("rows",mapList);

         return returnMap;
     }

Db2page.java:

 package com.ppms.utils;

 import java.io.IOException;
 import java.io.PrintWriter;
 import java.text.DateFormat;
 import java.text.ParseException;
 import java.text.SimpleDateFormat;
 import java.util.ArrayList;
 import java.util.Calendar;
 import java.util.Date;
 import java.util.HashMap;
 import java.util.List;
 import java.util.Map;

 import javax.servlet.http.HttpServletResponse;

 import com.alibaba.fastjson.JSONObject;

 public class Db2Page {
     String fieldPage; // 页面的fieldID

     String columnDB; // 数据库的字段名

     IMyDataExchanger dataExchanger; // 数据变换

     // 构造函数1：当页面的fieldID与数据库字段一致时（数据也不用变换）
     public Db2Page(String fieldPage) {
         this.fieldPage = fieldPage;
         this.columnDB = fieldPage;
         this.dataExchanger = null;
     }

     // 构造函数2：当页面的fieldID与数据库字段不一致时（数据不用变换）
     public Db2Page(String fieldPage, String columnDB) {
         this.fieldPage = fieldPage;
         if (columnDB == null) {// 与fieldPage相同
             this.columnDB = fieldPage;
         } else {
             this.columnDB = columnDB;
         }
         this.dataExchanger = null;
     }

     // 构造函数3：当页面的fieldID与数据库字段不一致，且数据要进行变换（当然都用这个构造函数也行）
     public Db2Page(String fieldPage, String columnDB,
             IMyDataExchanger dataExchanger) {
         this.fieldPage = fieldPage;
         if (columnDB == null) {// 与fieldPage相同
             this.columnDB = fieldPage;
         } else {
             this.columnDB = columnDB;
         }
         this.dataExchanger = dataExchanger;
     }

     /**
      * 取页面表示绑定的fieldID
      */
     public String getKey() {
         return fieldPage;
     }

     /**
      * 取页面表示对应的值
      *
      * @param mapDB
      *            : 从数据库直接取得的结果集(一条数据的MAP)
      * @return Object : 页面表示对应的值
      */
     public Object getData(Map mapDB) {
         Object objValue = mapDB.get(columnDB);
         if (objValue == null) {
             return null;
         } else {
             if (dataExchanger != null) {
                 return dataExchanger.exchange(objValue);
             } else {
                 return objValue;
             }
         }
     }

     // 数据变换的统一接口
     interface IMyDataExchanger {
         public Object exchange(Object value);
     }

     /**
      * 返回easyUI的DataGrid数据格式的JSONObject对象
      *
      * @param mapList
      *            : 从数据库直接取得的结果集列表
      * @param iTotalCnt
      *            : 从数据库直接取得的结果集总数据条数
      * @param dataExchanger
      *            : 页面表示数据与数据库字段的对应关系列表
      * @return JSONObject
      */
     public static JSONObject getJsonDatagridEasyUI(
             List<Map<String, Object>> mapList, int iTotalCnt,
             Db2Page[] dataExchanger) {
         StringBuilder returnJson = new StringBuilder();

         List<Map<String, Object>> forList = new ArrayList<Map<String, Object>>();

         if (mapList != null && mapList.size() > 0) {
             returnJson.append("{\"total\":").append(iTotalCnt)
                     .append(",\"rows\":");

             for (int j = 0; j < mapList.size(); j++) {
                 Map<String, Object> m = mapList.get(j);
                 Map<String, Object> forMap = new HashMap<String, Object>();
                 for (int i = 0; i < dataExchanger.length; i++) {
                     Object objValue = dataExchanger[i].getData(m) == null ? ""
                             : dataExchanger[i].getData(m);
                     forMap.put(dataExchanger[i].getKey(), objValue);
                 }
                 forList.add(forMap);
             }

             returnJson.append(JSONObject.toJSONString(forList)).append("}");

         } else {
             returnJson.append("{\"total\":").append(0).append(",\"rows\":[")
                     .append("]}");
         }

         JSONObject jObject = (JSONObject) JSONObject.parseObject(returnJson
                 .toString());
         return jObject;
     }

     public static String isNull(String value) {
         if (value == null || "null".equals(value)) {
             return "";
         }
         return value;
     }

     public static boolean isFalse(String value) {
         if (value == null || "null".equals(value) || "".equals(value)) {
             return false;
         }
         return true;
     }

     private int getMonthDay(String month) {
         int year = Integer.parseInt(month.substring(0, 4));
         int mth = Integer.parseInt(month.substring(4, 6));
         Calendar calendar = Calendar.getInstance();
         calendar.clear(); // 在使用set方法之前，必须先clear一下，否则很多信息会继承自系统当前时间
         calendar.set(Calendar.YEAR, year);
         calendar.set(Calendar.MONTH, mth - 1); // Calendar对象默认一月为0
         int endday = calendar.getActualMaximum(Calendar.DAY_OF_MONTH);// 获得本
         return endday;
     }

     public static void responseString(HttpServletResponse response, String json) {
         response.setContentType("application/json");
         response.setHeader("Cache-Control", "no-store");
         try {
             PrintWriter pw = response.getWriter();
             pw.write(json);
             pw.flush();
         } catch (IOException e) {
             e.printStackTrace();
         }
     }

     public static void responseDatagrid(HttpServletResponse response,
             JSONObject jObject) {
         if (jObject == null)
             jObject = new JSONObject();
         response.setContentType("application/json");
         response.setHeader("Cache-Control", "no-store");
         try {
             PrintWriter pw = response.getWriter();
             pw.write(jObject.toString());
             pw.flush();
         } catch (IOException e) {
             e.printStackTrace();
         }
     }

     /**
      * 使用Db2Page.getJsonDatagridEasyUI导致的问题
      * 01）包含单引号'：
      * Exception in thread "main" com.alibaba.fastjson.JSONException: syntax error, position at 33, name 管理单位
      * 02）包含转义\：
      * Exception in thread "main" com.alibaba.fastjson.JSONException: unclosed single-quote string
      * @param args
      */
     public static void main(String[] args) {
         Db2Page[] db2Pages = {
                 new Db2Page("管理单位"),new Db2Page("orgNo", "ORGNO")};
         List<Map<String,Object>> detailList = new ArrayList<Map<String, Object>>();
         Map<String, Object> row = new HashMap<String, Object>();
         row.put("管理单位", "吉林供电\\单位");
         row.put("ORGNO", "00001");
         detailList.add(row);
         Map<String, Object> newrow = new HashMap<String, Object>();
         newrow.put("管理单位", "吉林长春供电\\单位");
         newrow.put("ORGNO", "000011");
         detailList.add(newrow);

         JSONObject jObject = Db2Page.getJsonDatagridEasyUI(detailList, 5, db2Pages);
         System.out.println(jObject.toJSONString());
     }
 }

少壮不努力, 老大开夏利, 夏利都没有...