今天新学的内容,Ajax分页,初次学习,希望快速进步
1.第一步模型层,
1.1.1.写好Dao层,BaseDao(写好baseDao,万用)
1 package dao; 2 3 import java.sql.Connection; 4 import java.sql.SQLException; 5 import java.sql.Statement; 6 7 import javax.naming.Context; 8 import javax.naming.InitialContext; 9 import javax.sql.DataSource; 10 11 public class BaseDao { 12 13 public Connection getCon() throws ClassNotFoundException, SQLException{ 14 Context c = null; 15 Connection con = null; 16 DataSource source = null; 17 try { 18 c = new InitialContext(); 19 source = (DataSource)c.lookup("java:comp/env/jdbc/sc"); 20 con = source.getConnection(); 21 return con; 22 } catch(Exception e) { 23 e.printStackTrace(); 24 } 25 return null; 26 } 27 28 public void closeAll(Connection con ,Statement stmt, java.sql.ResultSet rs) throws SQLException { 29 if(rs != null) rs.close(); 30 if(stmt != null) stmt.close(); 31 if(con != null && ! con.isClosed()) con.close(); 32 } 33 }
1.1.2. 子类Dao层,处理与数据库之间的业务
1 package dao; 2 3 import java.sql.Connection; 4 import java.sql.PreparedStatement; 5 import java.sql.ResultSet; 6 import java.util.ArrayList; 7 import java.util.List; 8 9 import entity.Dept; 10 import entity.Emp; 11 12 public class Dao extends BaseDao{ 13 /** 14 * 根据当前页查找数据信息 15 * */ 16 public List<Emp> queryIfm(int s, int e) throws Exception { 17 List<Emp> list = new ArrayList<Emp>(); 18 Connection con = getCon(); 19 PreparedStatement stmt = null; 20 ResultSet rs = null; 21 try{ 22 String sql = "SELECT ename,job,sal,dname FROM" + 23 " (" + 24 " SELECT ename,job,sal,dname,ROWNUM r FROM emp JOIN dept ON emp.deptno = dept.deptno WHERE ROWNUM <= ? )" + 25 " WHERE r > ?"; 26 stmt = con.prepareStatement(sql); 27 stmt.setInt(1, e); 28 stmt.setInt(2, s); 29 rs = stmt.executeQuery(); 30 while( rs.next() ) { 31 Emp emp = new Emp(); 32 Dept dept = new Dept(); 33 emp.setName(rs.getString("ename")); 34 emp.setJob(rs.getString("job")); 35 dept.setDname(rs.getString("dname")); 36 emp.setDept(dept); 37 emp.setSal(rs.getDouble("sal")); 38 list.add(emp); 39 } 40 }catch(Exception ex) { 41 ex.printStackTrace(); 42 } finally { 43 closeAll(con, stmt, rs); 44 } 45 return list; 46 } 47 /** 48 * 查询信息总条数 49 * */ 50 public int queryCount() throws Exception { 51 Connection con = getCon(); 52 PreparedStatement stmt = null; 53 ResultSet rs = null; 54 int result = 0; 55 try{ 56 String sql = "SELECT COUNT(1) FROM emp"; 57 stmt = con.prepareStatement(sql); 58 rs = stmt.executeQuery(); 59 if( rs.next() ) { 60 result = rs.getInt(1); 61 } 62 } catch( Exception e ) { 63 e.printStackTrace(); 64 } finally { 65 closeAll(con, stmt, rs); 66 } 67 return result; 68 } 69 70 71 }
1.2 Service层
1 package service; 2 3 import java.util.ArrayList; 4 import java.util.List; 5 6 import dao.Dao; 7 import entity.Emp; 8 9 public class FenYeService { 10 11 Dao dao = new Dao(); 12 /** 13 * 返回查询信息列表 14 * */ 15 public List<Emp> returnAllIfm(int page,int pageSize) throws Exception { 16 17 int s = (page-1) * pageSize; 18 int e = page * pageSize; 19 return dao.queryIfm(s, e); 20 } 21 /** 22 * 根据返回到总数据条数,计算总页数 23 * */ 24 public int returnAllPage(int pageSize) throws Exception { 25 int allCount = dao.queryCount(); 26 int allPage = allCount % pageSize == 0 ? allCount /pageSize : allCount / pageSize + 1; 27 return allPage; 28 } 29 }
2.控制层
servlet
1 public void doPost(HttpServletRequest request, HttpServletResponse response) 2 throws ServletException, IOException { 3 4 request.setCharacterEncoding("utf-8"); 5 response.setCharacterEncoding("utf-8"); 6 response.setContentType("text/html,charset=utf-8"); 7 8 // 获取当前页 9 String pageStr = request.getParameter("nowPage"); 10 int nowPage = pageStr == null ? Counts.nowPage : Integer.parseInt(pageStr); 11 // 获取每页显示数目 12 String pageS = request.getParameter("size"); 13 int pageSize = pageS == null ? Counts.pageSize : Integer.parseInt(pageS); 14 15 16 FenYeService fenyeService = new FenYeService(); 17 try { 18 // 获取信息集合 19 List<Emp> list = fenyeService.returnAllIfm(nowPage, pageSize); 20 // 获取总页数 21 int totalPage = fenyeService.returnAllPage(pageSize); 22 String JsonStr = parseJson(list,totalPage); 23 PrintWriter out = response.getWriter(); 24 out.print(JsonStr); 25 } catch (Exception e) { 26 e.printStackTrace(); 27 } 28 } 29 30 private String parseJson(List<Emp> list, int totalPage) { 31 StringBuffer sb = new StringBuffer(); 32 sb.append("{"); 33 34 sb.append(" "totalPage":" "+totalPage+" " "); 35 sb.append(","); 36 sb.append(" "list":[ "); 37 for(Emp emp : list) { 38 sb.append(" {"empName" : " "+emp.getName()+" "," + 39 " "empJob" : " "+emp.getJob()+" "," + 40 " "empSal" : " "+emp.getSal()+""," + 41 " "empDName" : " "+emp.getDept().getDname()+" " }"); 42 sb.append(","); 43 } 44 45 sb.deleteCharAt(sb.length()-1); 46 sb.append("]}"); 47 return sb.toString(); 48 }
3. 视图层
1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 2 3 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 4 <html> 5 <head> 6 7 <title>ajax分页</title> 8 9 <meta http-equiv="pragma" content="no-cache"> 10 <meta http-equiv="cache-control" content="no-cache"> 11 <meta http-equiv="expires" content="0"> 12 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 13 <meta http-equiv="description" content="This is my page"> 14 15 <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/Emp.css"> 16 <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.1.js"></script> 17 <script type="text/javascript"> 18 // 创建一个xmlHttpRequest 对象 19 var xmlHttpRequest = null; 20 // 判断浏览器类型 21 function getXmlHttpRequest() { 22 // 非IE 23 if(window.XMLHttpRequest){ 24 xmlHttpRequest = new XMLHttpRequest(); 25 } else { 26 xmlHttpRequest = new ActiveXObject("Microsoft,XMLHTTP"); 27 } 28 } 29 // 请求AJAX 30 function requestAjax(p) { 31 // 获得浏览器类型 32 getXmlHttpRequest(); 33 if(xmlHttpRequest) { 34 //初始化动作 35 xmlHttpRequest.open("post","../fenyeServlet",true); 36 xmlHttpRequest.onreadystatechange = CallBack; 37 xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 38 // 正式发送请求 39 xmlHttpRequest.send("nowPage=" + p); 40 } 41 } 42 43 function CallBack () { 44 if(xmlHttpRequest.readyState == 4 && 45 xmlHttpRequest.status == 200) { 46 var result = xmlHttpRequest.responseText; 47 result = eval("("+result+")"); 48 $("#tb tr:not(:first)").remove(); 49 var trs = createTr(result); 50 $("#tb").append(trs); 51 } 52 } 53 54 function createTr(jsonObj){ 55 var jsAr = new Array(); 56 for(var i = 0; i < jsonObj.list.length; i ++) { 57 var emp = jsonObj.list[i]; 58 jsAr.push("<tr>"); 59 jsAr.push("<td>"); 60 jsAr.push(i + 1); 61 jsAr.push("</td>"); 62 jsAr.push("<td>"); 63 jsAr.push(emp.empName); 64 jsAr.push("</td>"); 65 jsAr.push("<td>"); 66 jsAr.push(emp.empJob); 67 jsAr.push("</td>"); 68 jsAr.push("<td>"); 69 jsAr.push(emp.empSal); 70 jsAr.push("</td>"); 71 jsAr.push("<td>"); 72 jsAr.push(emp.empDName); 73 jsAr.push("</td>"); 74 jsAr.push("</tr>"); 75 } 76 77 jsAr.push("<tr>"); 78 jsAr.push("<td colspan='5' align='right'>"); 79 80 for(var i = 1; i <= jsonObj.totalPage; i++) { 81 jsAr.push("<a class='page' href='javascript:void(0);' onclick='requestAjax(""+i+"");'>"+ i +"</a> "); 82 jsAr.push(""); 83 } 84 jsAr.push("</td>"); 85 jsAr.push("</tr>"); 86 //join("")起连接作用 87 return jsAr.join(""); 88 } 89 90 window.onload = function() { 91 requestAjax(1); 92 } 93 94 </script> 95 </head> 96 97 <body> 98 <table id="tb"> 99 <tr> 100 <td>序号</td> 101 <td>员工姓名</td> 102 <td>员工工作</td> 103 <td>员工工资</td> 104 <td>员工部门</td> 105 </tr> 106 </table> 107 </body> 108 </html>
以上是核心代码,下面加上entity包
css代码,虽然不好看,但也不至于太难看
1 table { 2 background-color: black; 3 margin: auto; 4 5 } 6 7 td { 8 background-color: white; 9 width: 150px; 10 text-align: center; 11 }
1.Emp类
1 package entity; 2 3 public class Emp { 4 5 private String name; 6 private String job; 7 private double sal; 8 private Dept dept; 9 10 public Dept getDept() { 11 return dept; 12 } 13 public void setDept(Dept dept) { 14 this.dept = dept; 15 } 16 public String getName() { 17 return name; 18 } 19 public void setName(String name) { 20 this.name = name; 21 } 22 public String getJob() { 23 return job; 24 } 25 public void setJob(String job) { 26 this.job = job; 27 } 28 public double getSal() { 29 return sal; 30 } 31 public void setSal(double sal) { 32 this.sal = sal; 33 } 34 35 36 37 38 }
2.Dept类
1 package entity; 2 3 import java.util.List; 4 5 public class Dept { 6 7 private String deptno; 8 private String dname; 9 private String loc; 10 private List<Emp> list; 11 12 public List<Emp> getList() { 13 return list; 14 } 15 public void setList(List<Emp> list) { 16 this.list = list; 17 } 18 public String getDeptno() { 19 return deptno; 20 } 21 public void setDeptno(String deptno) { 22 this.deptno = deptno; 23 } 24 public String getDname() { 25 return dname; 26 } 27 public void setDname(String dname) { 28 this.dname = dname; 29 } 30 public String getLoc() { 31 return loc; 32 } 33 public void setLoc(String loc) { 34 this.loc = loc; 35 } 36 37 }
3.count工具包
1 package count; 2 3 public class Counts { 4 5 // 默认显示页 6 public static final int nowPage = 1; 7 // 每页显示的条数 8 public static final int pageSize = 5; 9 }
最终运行效果