天天看點

用Servlet和jsp實作分頁查詢

用Servlet和jsp實作分頁查詢

分頁查詢

相對web階段是有點難度的,這裡運用的知識還挺多。考驗到你對JDBC掌握的程度、對servlet的request和jsp的了解程度。

首先先來分析一波:

為什麼我們要用到分頁查詢,分頁查詢的好處時是什麼?

1.減輕伺服器的開銷

2.提升使用者的體驗

理論圖講解

用Servlet和jsp實作分頁查詢

先建立PageBean分頁對象

public class PageBean<T> {
    //資料總條數
    private int totalCount;
    //總頁數
    private int totalPage;
    //每頁的資料
    private List<T> list;
    //目前頁碼
    private int currentPage;
    //每頁顯示多少條資料
    private int rows;
           

其餘構造方法、set、get、toString方法自行實作

而這些資料往往是我們實作分頁的核心資料!!!

這是分頁查詢的頁碼,當我們點選第幾頁時,會發生這樣的跳轉

用Servlet和jsp實作分頁查詢
用Servlet和jsp實作分頁查詢

建立FindDataDao接口,寫入這兩段代碼,用來查詢資料的總條數和可分為頁數

//定義接口,面向接口程式設計這樣會降低耦合度
public interface FindDataDao {
    /**
     * 查詢資料
     */
     List<User> findData(User user);

     User findOne(String name);

     List<User> findLimik(int branches,int rows );

     int findCount();
   
  	}
           

實作Dao接口

package com.itheima.firstproject.dao.impl;

import com.itheima.firstproject.Uitls.JDBCUtils;
import com.itheima.firstproject.dao.FindDataDao;
import com.itheima.firstproject.domain.User;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;

import java.util.List;

public class FindDataImpl implements FindDataDao {
		//連接配接資料庫,配置檔案和JDBCUtils工具類自己實作
    JdbcTemplate jt = new JdbcTemplate(JDBCUtils.getDataSource());
    
      @Override
      //查詢從第幾條開始,總共查詢rows條
    public List<User> findLimik(int start, int rows) {
        String sql = "Select *  from user limit ? , ? ";
        List<User> list = jt.query(sql, new BeanPropertyRowMapper<User>(User.class), start, rows);
        return list;
    }
	//查詢到總條數
    @Override
    public int findCount() {
        String sql = "select count(*) from user";
        Integer totalCount = jt.queryForObject(sql, Integer.class);
        return totalCount;
    }
           

通過上面的代碼就可以查詢到資料庫的總條數,和第幾頁該查詢的資料會存入到list集合中

然後定義UserServic接口來接收這些資料

package com.itheima.firstproject.service;

import com.itheima.firstproject.domain.PageBean;
import com.itheima.firstproject.domain.User;

import java.util.List;

public interface UserServic {
    /**
     * 利用分頁查詢傳回資料
     */
    PageBean<User> findLimitData( PageBean<User> pb);
           

實作接口

package com.itheima.firstproject.service.impl;

import com.itheima.firstproject.dao.FindDataDao;
import com.itheima.firstproject.dao.JdbcDao;
import com.itheima.firstproject.dao.impl.FindDataImpl;
import com.itheima.firstproject.dao.impl.JdbcDaoImpl;
import com.itheima.firstproject.domain.PageBean;
import com.itheima.firstproject.domain.User;
import com.itheima.firstproject.service.UserServic;

import java.util.List;

public class UserServicImpl implements UserServic {
	//查詢資料,并封裝到PageBean資料中去
    @Override
    public PageBean<User> findLimitData(PageBean<User> pb) {
        //父類接口引用子類對象
        FindDataDao fd = new FindDataImpl();
        //擷取查詢的總條數
        int tatolCount = fd.findCount();
		//查詢到每頁資料
		list<User> list = fd.findLimik(int start, int rows);
		 int row = pb.getRows();
		//計算最多分為幾頁
        int totalPage = totalCount % row == 0 ? totalCount / row : (totalCount / row )+1;
		//封裝到PageBean對象中
		pb.setList(list);
        pb.setTotalCount(tatolCount);
        pb.setTotalPage(totalPage )
        return pb;
    }
           

接下來用代碼實作一下:

package com.itheima.firstproject.web;

import com.itheima.firstproject.dao.FindDataDao;
import com.itheima.firstproject.dao.impl.FindDataImpl;
import com.itheima.firstproject.domain.PageBean;
import com.itheima.firstproject.domain.User;
import com.itheima.firstproject.service.UserServic;
import com.itheima.firstproject.service.impl.UserServicImpl;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;

@WebServlet("/findUserServlet")
public class FindUserServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    	 //設定編碼
        request.setCharacterEncoding("utf-8");
 		//擷取目前頁碼和每頁顯示的條數rows
        String currentPage = request.getParameter("currentPage"); 
 		String rows = request.getParameter("rows");
 		//當浏覽器穿過來的參數為空時,預設頁數跟步長  
        if (rows == null || "".equals(rows)){
            rows = "5";
        }
        if(currentPage == null ||  "".equals(currentPage)){
			currentPage = "1";
		}
		//轉換資料
        int currentPag = Integer.parseInt(currentPage);
        int row= Integer.parseInt(rows);
        //建立PageBean對象
        PageBean<User> pb1= new PageBean<User>();
        pb1.setCurrentPage(currentPag );
        pb1.setRows(row);
		UserServic users = new UserServicImpl();
		擷取值
		PageBean<User> pb  = user.findLimitData(pb1)
		将pb存入到request域中
		 //将資料轉發到list.jsp當中去
         request.setAttribute("pb", pb);
         //轉發到顯示界面上去
         request.getRequestDispatcher("/list.jsp").forward(request, response);
       }
   }


           

跳轉到list.jsp頁面時,我們将用到EL,和JSTL,展示資料的代碼

<form id="form" action="${pageContext.request.contextPath}/deleteServlet" method="post">
        <table  class="table table-bordered table-hover">
        <tr class="success">
            <th><input type="checkbox" id="firstCb"></th>
            <th>編号</th>
            <th>姓名</th>
            <th>性别</th>
            <th>年齡</th>
            <th>籍貫</th>
            <th>QQ</th>
            <th>郵箱</th>
            <th>操作</th>
        </tr>
		<%--引入标簽庫:taglib指令: 周遊下列傳入進來的pb,每個pb裡面的list隻有rows步長的長度--%>
        <c:forEach items="${pb.list}" var="user" varStatus="s">
            <tr>
                <td><input type="checkbox" name="uid" value="${user.id}" ></td>
                <td>${s.count}</td>
                <td>${user.name}</td>
                <td>${user.gender}</td>
                <td>${user.age}</td>
                <td>${user.address}</td>
                <td>${user.qq}</td>
                <td>${user.email}</td>
                <%--pageContext.request.contextPath 等同于得到路徑--%>
                <td><a class="btn btn-default btn-sm" href="${pageContext.request.contextPath}/UpdateServlet?name=${user.name}" target="_blank" rel="external nofollow" >修改</a>&nbsp;
                    <%--javascript:deleteUser(${user.id});--%>
                    <a class="btn btn-default btn-sm" href="${pageContext.request.contextPath}/DeleteUserServlet?id=${user.id}" target="_blank" rel="external nofollow" >删除</a></td>
            </tr>

        </c:forEach>


    </table>
    </form>
           

顯示頁數的代碼

<nav aria-label="Page navigation">
        <ul class="pagination">
                <c:if test="${pb.currentPage == 1}">
                    <li class="disabled">
                </c:if>
                <c:if test="${pb.currentPage != 1}">
                    <li>
                </c:if>
                    <a href="${pageContext.request.contextPath}/dindUserServlet?currentPage=${pb.currentPage-1}&rows=5" target="_blank" rel="external nofollow"  aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                    </li>


            <c:forEach begin="1" end="${pb.totalPage}" var="i">
                <c:if test="${pb.currentPage == i}">
                    <li class="active"><a href="${pageContext.request.contextPath}/<%=request.getAttribute(" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" yu")%>?currentPage=${i}&rows=5">${i}</a></li>
                </c:if>
                <c:if test="${pb.currentPage != i}">
                <li><a href="${pageContext.request.contextPath}/<%=request.getAttribute(" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" yu")%>?currentPage=${i}&rows=5">${i}</a></li>
            </c:if>
            </c:forEach>
            <%--判斷是不是本頁,假如時本頁那麼将高亮顯示-->
                <c:if test="${pb.currentPage == pb.totalPage}">
                    <li class="disabled">
                        <a href="${pageContext.request.contextPath}/<%=request.getAttribute(" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" yu")%>?currentPage=${pb.currentPage}&rows=5" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span></a>
                    </li>
                </c:if>
                <c:if test="${pb.currentPage < pb.totalPage}">
				 <%--最右邊的箭頭,每點選一次,頁數加1,跳轉到下一頁資料顯示-->
                    <li>
                        <a href="${pageContext.request.contextPath}/<%=request.getAttribute(" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" yu")%>?currentPage=${pb.currentPage+1}&rows=5" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span></a>
                    </li>

                </c:if>


            <br>
            <a href="#" target="_blank" rel="external nofollow"  aria-label="Next">
                    <span aria-hidden="true"><h1>共${pb.totalCount}條記錄,共${pb.totalPage}頁</h1>
                    </span>
            </a>
        </ul>
    </nav>
           

分頁查詢基本就是這樣去實作的,省略了很多代碼,就不展現啦。

加油!你是最(pang)的!!!!