一个简单的分页 jqery ajax 才开始学 ,写的不是很好
action
public String queryAllajax(){ ActionContext context = ActionContext.getContext(); HttpServletRequest request = ServletActionContext.getRequest(); int page = Integer.valueOf(request.getParameter("page")); int pageSize = 5;//偏移量,每次要查询出的pageSize条记录 int pageNow = Integer.valueOf(request.getParameter("page")); //当前页码 int pageCount = 0;//总页数 int onset = 0;//起始记录位置 int offset = 0; //结尾记录位置 List<AssistantInfo> list = new ArrayList<AssistantInfo>(); try { int count = InfoFactory.getInstance().getItemNum();//总记录数 pageCount = (count + pageSize - 1) / pageSize;//计算出总页数 if (pageNow < 1) { pageNow = 1; } if (pageNow > pageCount) { pageNow = pageCount; } onset = (pageNow - 1) * pageSize; offset = onset + pageSize; list = InfoFactory.getInstance().queryAll(offset, onset);//查询出所有的信息 StringBuffer dataSource = new StringBuffer(); dataSource.append("{\"dataSource\":"); dataSource.append(JsonUtils.listToJson(list));//把list转换为json Map map = new HashMap(); map.put("pageCount", pageCount); map.put("pageNow", pageNow); map.put("count",count); map.put("pageSize",pageSize ); String s= JsonUtils.mapToJson(map);//把map转换为json dataSource.append(",\"pageSource\":["); dataSource.append(s);// 总页数、当前页码 添加到json dataSource.append("]}"); System.out.println(dataSource); HttpServletResponse response = ServletActionContext.getResponse(); response.setContentType("text/javascript");//数据按照js格式送回去 response.setCharacterEncoding("UTF-8"); PrintWriter out = response.getWriter(); out.write(dataSource.toString()); out.flush(); out.close(); } catch (Exception e) { e.printStackTrace(); } return null; }
//进入页面时查询的数据 $(document).ready(function(){ var page=1; jqeryajax(page); }); //首页 function firstpage(){ var page= document.listpage.pagenumber.value = 1; jqeryajax(page); } //上一页 function prepage(){ var page = document.listpage.pagenumber.value; page = parseInt(page); if(page>1){ page -= 1; document.listpage.pagenumber.value = page; } jqeryajax(page); } //下一页 function nextpage(){ $(document).ready(function(){ var page = document.listpage.pagenumber.value; page = parseInt(page); page += 1; document.listpage.pagenumber.value = page; jqeryajax(page); }); } //尾页 function lastpage(){ var page=document.getElementById('myspan').innerHTML;/取出span里值 jqeryajax(page); } // 查询数据的分页跳转 function jqeryajax(page){ $.ajax({ url:'ass/assinfo_queryAllajax.action?page='+page, type:"POST", dataType:'json', success:function(data){ $(data).each(function() { insertTr(data); }); } }); } function insertTr(data) { //读取tr里数量 var r = $("#datasource tr").size(); // alert("r"+r); var num = 0; if(r < 1){ num = 1; }else if(r > 1){ $("#datasource").find("tr:not(:first)").remove(); } var list = data.dataSource;//查询出的数据 var list1 = data.pageSource;//总页数、当前页码 $.each(list1,function(i, item){ // alert("pageSize"+item.pageSize+"pageNow"+item.pageNow); $("#myspan").html(item.pageCount); $("#pagenumber").val(item.pageNow); }); $.each(list, function(i, r) { //克隆已有的表格样式及属性 var row = $("#source").clone(); //将数值填充至表格中 row.find("#rnum").text(r.rnum) row.find("#as_number").text(r.as_number); row.find("#as_name").text(r.as_name); row.find("#as_idcard").text(r.as_idcard); //将此行添加到表格中 row.appendTo("#datasource"); }); // 移除第一行,因为它只有样式没有数据 $("#datasource").children("tr:first").remove(); }
<TR bgColor="#F7F7F7"> <TD width=9% height="29" align=center class=font_black>序号</TD> <TD width=16% align=center class=font_black>营业员编号</TD> <TD width=18% align=center class=font_black>营业员姓名</TD> <TD width=26% align=center class=font_black>身份证号码</TD> <TD width=31% align=center class=font_black>操作</TD> </TR> <tbody id="datasource"> <TR bgColor=#ffffff id="source"> <TD height="27" id="rnum" align=center class="font_black22"></TD> <TD class="cs" id="as_number" valign=center class="font_black22"> </TD> <TD align=center id="as_name" class="font_black22"></TD> <TD align=center id="as_idcard" class="font_black22"> </TD> <TD align=center class="font_black22"> <a href="s_regsucca.jsp">修改信息 <a href="updatesucess.jsp" onclick="javascript:if(!confirm('警告:执行此操作将删除数据库中已存在的所有营业员信息,您确定要删除吗?'))return false;return true;">删除信息</TD> </TR> </tbody> <form action="assInfoList.do" name="listpage"> <input type="button" value="首页" onClick="firstpage()"> <input type="button" value="上一页" onClick="prepage()"> 第<input type="text" id="pagenumber" name="pagenumber">页 共<SPAN id="myspan"></SPAN>页 <input type="button" value="下一页" onClick="nextpage()"> </form>