zoukankan      html  css  js  c++  java
  • A1ax的分页

    今天新学的内容,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>&nbsp;&nbsp;");
     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 }

    最终运行效果

  • 相关阅读:
    bzoj1568: [JSOI2008]Blue Mary开公司
    bzoj3301: [USACO2011 Feb] Cow Line
    bzoj4745: [Usaco2016 Dec]Cow Checklist
    bzoj4746: [Usaco2016 Dec]Lasers and Mirrors
    bzoj2982: combination
    bzoj1822: [JSOI2010]Frozen Nova 冷冻波
    bzoj1027: [JSOI2007]合金
    bzoj 2004
    bzoj 3110&&codevs 1616
    bzoj 2134
  • 原文地址:https://www.cnblogs.com/cfb513142804/p/4203757.html
Copyright © 2011-2022 走看看