jQuery EasyUI教程之datagrid應用（二）

標籤：first   tps   string   null   new   class   cep   date   .sh   

上次寫到了讓資料庫資料在網頁datagrid顯示，我們只是單純的實現了顯示，仔細看的話顯示的資訊並沒有達到我們理想的效果，這裡我們豐富一下：

上次顯示的結果是這樣的      

點擊查看上篇： jQuery EasyUI教程之datagrid應用（一）

這裡不難發現生日的格式是毫秒（long型資料），並不是我們想要的年月日的格式，那我們就修改一下

我們在js中寫入格式時間的方法，並在生日一列用formatter來調用方法格式時間，

//格式化時間//把long型日期轉為想要類型function getDate(date){    //得到日期對象    var d = new Date(date) ;        //得到年月日    var year = d.getFullYear() ;    var month = (d.getMonth()+ 1) ;    var day = d.getDate() ;        //封裝    var tt = year+"-"+(month<10?"0"+month: month)+"-"+(day<10?"0"+day:day) ;        return tt ;    }

此時，我們在查看頁面，我們就發現生日欄變成我們想要的結果了

 

接下來就是分頁了，原理 ：datagrid有分頁功能，我們只要把分頁開啟就好，當發送請求時，他會自己傳遞兩個參數到Servlet，我們接受下再傳遞給dao，Hibernate也提供了分頁功能，我們一結合就好了，

1.我們現在dao層修改下上次的代碼，將參數傳遞過去

//查詢連絡人      public List<Phone> showAll(int page, int rows)      {          init() ;                    List<Phone> list = null ;                    String hql = "from Phone where 1=1 " ;                    list = se.createQuery(hql)                          .setMaxResults(rows)                          .setFirstResult((page - 1) * rows )                          .list() ;                    destroy();                    return list;      }    

2.並且還要增加一個查詢總數的方法

　　這裡我們要查詢總數，值得注意的是我們這用的是Object類型的List集合

//擷取連絡人記錄條數      public int getTotal()      {          init() ;                  int rtn = 0 ;                    List<Object> list = null ;                    String hql = "select count(1) from Phone where 1=1 " ;                    list = se.createQuery(hql).list() ;                    if(list != null && list.size() > 0 )//判斷擷取的集合非空及長度            {                rtn = Integer.parseInt(list.get(0).toString()) ;//給變數rtn賦值            }                    destroy();                    return rtn;      }

3.接下來我們再在service層修改下我們的方法，將記錄的條數添加進去

public String getPageJSON(int page, int rows)    {        String rtn = "{\"total\":0,\"rows\":[ ]}";//定義變數並初始化JSON格式的結果集                PageJSON<Phone> pjson = new PageJSON<Phone>() ;//封裝Rate類                int total =  new PhoneDAO().getTotal() ;                if(total > 0)        {            List<Phone> list = new PhoneDAO().showAll(page, rows) ;//定義List集合并賦值                        String json_list = JSONArray.toJSONString(list) ; //將List集合轉為JSON集合                            /*                 * 通過set方法給執行個體化的對象賦值                 */            pjson.setRows(list);             pjson.setTotal(total);                            rtn = JSONArray.toJSONString(pjson) ; //將對象JSON類型的數組        }                return rtn ; //返回JSON類型的結果集    }

4.最後我們在修改下Servlet的doGet方法

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {        //轉碼        request.setCharacterEncoding("UTF-8");        response.setCharacterEncoding("UTF-8");        response.setContentType("text/html");                        //接收請求            //1每頁行數        String rows = request.getParameter("rows") ;                            //2頁碼        String page = request.getParameter("page") ;                if(rows != null && page != null)//非空判斷        {            int rowss = Integer.parseInt(rows) ;//類型轉換                        int pagess = Integer.parseInt(page) ;//類型轉換                        String json_list = new PhoneService().getPageJSON(pagess, rowss) ;//方法調用                        response.getWriter().write(json_list) ;        }        else        {            response.getWriter().write("{\"total\":0,\"rows\":[ ]}") ;        }            }

到這裡我們的分頁功能就實現了。

下篇datagrid增刪改

 

jQuery EasyUI教程之datagrid應用（二）