使用Struts2和jQuery EasyUI实现简单CRUD系统(四)——数据分页处理
上篇完成多选删除的功能之后,接下来就是做分页功能了。以前的分页是一个麻烦的问题。而且数据量巨大的时候,直接把这些元素取出来显然速度较慢,所以取一定区间的数据还是高效的。
之前自己写分页的时候,分页的界面当然是自己做的,用了ejui之后,真的方便了很多。方便到什么程度了。
<table id="dg" title="My Users" class="easyui-datagrid" style="width: 700px; height: 500px" url="list_ej" toolbar="#toolbar" rownumbers="true" fitColumns="true" > <thead> <tr> <!-- 这种写法也是可以的 <th field="id" width="50">id</th> <th field="name" width="50">name</th> <th field="password" width="50">password</th> --> <th field="ck" checkbox="true"></th> <th data-options="field:'id',width:'200px'">id</th> <th data-options="field:'name',width:'200px'">name</th> <th data-options="field:'password',width:'200px',align:'right'">password</th> </tr> </thead> </table>
只需要在属性里面添加:
pagination="true" pageNumber ="1"pagination是在底部显示分页工具栏,pageNumber是原始的显示的页数,第几页。
难点在于后台数据要怎么传过去。在没和后台正确处理页数和每页显示的数据数的关系时,是全部显示的,但是选择页面数的时候ejui还是会正确地帮你跳到具体的页数。但这显然不是我们想要的。
后面在思路上就卡住了,我要怎么将分页栏的数据传到action里面呢?
解决办法是,直接由rows和page属性,分别对应一页显示的数据条数和当前页数,只需要在action里面声明为全局变量,并写出对应的get和set方法。
public class ControlAction extends ActionSupport{ private int rows; private int page; public int getRows() { return rows; } public void setRows(int rows) { this.rows = rows; } public int getPage() { return page; } public void setPage(int page) { this.page = page; }
拿到之后容易处理。我们可以写一个封装的方法将拿到的页数和条数,对数据库操作并转换为json串。
public String list_ej(){ ActionContext ctx=ActionContext.getContext(); String result=""; result= PageUtil.getPage(page, rows); try { // ServletActionContext.getResponse().getWriter().println(JSONArray.fromObject(list)); ctx.put("json", result); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } return "success"; }
PageUtil.java
package util; import java.sql.Connection; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; import java.util.ArrayList; import java.util.List; import net.sf.json.JSONArray; import net.sf.json.JSONObject; public class PageUtil { public static String getPage(int pagenumber,int rows){ String result = ""; int count = 0; int number = 0; Connection c = ConnectToSQL.getConn(); Statement st = ConnectToSQL.getSt(c); List<User> list = new ArrayList<User>(); try { ResultSet countrs = st.executeQuery("select count(*) from user"); countrs.next(); // //System.out.println(countrs.getInt(1)); count = countrs.getInt(1); } catch (SQLException e1) { e1.printStackTrace(); } if(count%rows==0){ number =count/rows; }else{ number = count/rows+1; } // //System.out.println(number); try { int index = 0; if(pagenumber-1>0){ index = (pagenumber-1)*rows-1; } ResultSet rs = st.executeQuery("select * from user limit "+index+","+rows); while(rs.next()){ User u = new User(); u.setId(rs.getInt("userid")); u.setName(rs.getString("username")); u.setPassword(rs.getString("password")); list.add(u); } } catch (SQLException e) { e.printStackTrace(); } //这个把list看成数组,用json格式输出 只是输出list List<User> o = JSONArray.fromObject(list); //无需字符串拼接 //String result = "{\"total\":"+count+",\"rows\":"+s+"}"; //接下来的是吧整个对象转json格式 对象有两个属性 total和rows属性 而rows里面又是一个数组 JSONObject jo = new JSONObject(); jo.put("total", count); jo.put("rows", list); result = jo.toString(); return result; } }
ejui和struts2好用在哪里呢,ejui只需要接受到全部的数据条数和当前页的数据就是rows:后面的json数据,它会自动填充到DataGrid中。
{"total":5,"rows":[{"id":1277,"name":"df2","password":"123"}, {"id":1278,"name":"45ty","password":"123"}, {"id":1279,"name":"sdfy","password":"123"}, {"id":1280,"name":"345356","password":"p"}, {"id":1281,"name":"werwer","password":"twer"}]}
而一旦ejui的rows和page改变,
一旦你选择page和rows,是通过ajax将数据传递过去,然后DataGrid局部刷新。
它有会把参数传递给url,而struts本身通过get和set方法定义这两个属性之后又能取到这两个值,所以非常方便。
也非常强大,界面美观。
这个简单的CRUD系统功能大体完成,但是显然自己在JSON和EasyUI的掌握方面还不熟悉。这个还是要多练练。
项目github地址:https://github.com/iaiti/EasyUI-Struts2.git
将java代码和jsp页面代码分离,新建了分支version2.0。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。