ajax+servlet+mysql表格分页

分页，就是利用ajax异步获取servlet中查询的数据，但是数据是分页返回的（即每次查询返回一页数据）。效果大概是这个模样：



每次打开网页都会自动显示第一页的数据，也就是当$(document).ready()。

因为是根据页码page显示数据，上一页下一页只是判断页码是否超过界限，然后page-1或page+1，所以我写了一个函数，下面是js代码：

function ajaxPage(num) {
$.ajax({
type: "post",
url: "servlet/UserFindPagingServlet",
data: {
page: num,
department: departmentValue,
position: positionValue
},
dataType: "json",
success: function(result) {
$("#sumdata").html(result.sumdata);
$("#nowpage").html(result.nowpage);
$("#sumpage").html(result.sumpage);
$("#mainTable").empty();
$("#mainTable").append(
"<tr><td>id</td><td>姓名</td><td>性别</td><td>手机</td><td>部门</td><td>职位</td><td></td></tr>"
);
$.each(result.list, function(i) {

$("#mainTable").append(
"<tr><td>"+result.list[i].id+"</td><td>"+result.list[i].username+"</td><td>"+result.list[i].sex+"</td>"
+"<td>"+result.list[i].phone+"</td><td>"+result.list[i].department+"</td><td>"
+result.list[i].position+"</td><td><input type=\"checkbox\" name=\"deleteId\" value="+result.list[i].id+"></td></tr>"
);
});
}
});
}

$(document).ready(function(){
ajaxPage(1);

        $("#btn_firstpage").click(function() {
ajaxPage(1);
});

$("#btn_previouspage").click(function() {
if($("#nowpage").html() != 1) {
ajaxPage((parseInt($("#nowpage").html()) - 1));
}
});

$("#btn_nextpage").click(function() {
var now_page = parseInt($("#nowpage").html());
var sum_page = parseInt($("#sumpage").html());
if(now_page < sum_page) {
ajaxPage((now_page + 1));
}
});

$("#btn_lastpage").click(function() {
ajaxPage($("#sumpage").html());
});
}

首先显示第一页的内容，发page=1通过JQuery.ajax()发送到servlet然后接收返回的result，当然也通过后台查找到的数据设置好总数据数、当前页码、总页码，然后把数据append。下面是servlet中的doPost（）代码：

public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();

String department = request.getParameter("department");
String position = request.getParameter("position");
String page = request.getParameter("page");

System.out.println("department: " + department + "  position : " + position);

StaticMethod.find(department, position, page, out);

}

department和position是用于分部门和职位查询用的。由于增删改之后都需要调用select重新查找数据，所以我单独写了一个StaticMethod类，下面是StaticMethod中的find（）方法代码（只列出最简单的全查询）：

public static void find(String department, String position, String page, PrintWriter out) {
List<UserBean> list = UserPagingDAO.findAll(page);
List<UserBean> listnum = UserPagingDAO.findAll();
int sumdata = listnum.size();
int nowpage = Integer.parseInt(page);
int sumpage = sumdata / 10 + 1;

/*JSONArray json = JSONArray.fromObject(list);
JSONObject jsonobject = JSONObject.fromObject(json);*/
JSONObject jsonobject=new JSONObject();
jsonobject.put("sumdata", sumdata);
jsonobject.put("nowpage", nowpage);
jsonobject.put("sumpage", sumpage);
jsonobject.put("list", list);
out.print(jsonobject);
out.flush();
out.close();
}

最重要的关于数据库的分页查询了，我用的是mysql，sql语句如下：

select * from user order by id asc limit ? , ?；

第一个参数是从第几个开始，第二个参数是查询多少个数据。每次根据page更改就可以了。