JSP+JSTL+EL expression, realize the page jump function of web pages (previous page, next page, first page, last page page jump)

1. Paging display is everywhere
significance:
In practice, all data will not be displayed together, so the paging display of data needs to be considered
2. Preliminary preparation
(1) jar package

(2) Import the c tag library

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

3. Concrete Realization Analysis

  1. Realization: first page previous page
    Through hyperlinks, jump to BookServlet, and pass pageNo to achieve
<c:choose>
    <c:when test="${requestScope.page.pageNo>1}">
        <a href="BookServlet?action=page &pageNo=1">Homepage</a>
        <a href="BookServlet?action=page &pageNo=${requestScope.page.pageNo-1}">Previous page</a>
    </c:when>
    <c:otherwise>
        <a style="color: silver">Homepage</a>
        <a style="color: silver">Next page</a>
    </c:otherwise>
</c:choose>
  1. Realization: the last page and the next page, you can use the same method as above, or use jQuery to realize:
<a class="aclass" href="BookServlet?action=page &pageNo=${requestScope.page.pageNo + 1}">next page</a>
<a class="aclass" href="BookServlet?action=page & amp;pageNo=${requestScope.page.pageTotal}">Last page</a>
<input type="hidden" id="pageNo" value="${requestScope.page.pageNo}">
Total <span id="pageTotal">${<!-- --> requestScope.page.pageTotal}</span> pages
$(function () {<!-- -->
    var pageNo = parseInt($("#pageNo"). val());
    var pageTotal = parseInt($("#pageTotal").html());
    if (pageNo >= pageTotal) {<!-- -->
        $("a.aclass").removeAttr("href").css("color", "silver");
    }
});

3. Implementation: input page jump
Bind the click event through Jquery, respond to the jump servlet to call the page method and pass the pageNo implementation

$("#inputbtn").click(function () {<!-- -->
        location.href = "BookServlet?action=page & pageNo=" + $("#pn_input").val();
});
  1. Implementation: display 1 2【3】4 5, multi-page option
    |– If the total page number is less than or equal to 5, the range of page numbers is: 1-total page number
    |– If the total page number is greater than 5, then it needs to be discussed according to the situation
    |– start first 3, show 1-5
    |– The last 3 page numbers, display (Total-4)-Total
    |– outside, always keep the current page number in the middle, display (current page number – 2) – (current page number + 2)
<c:choose>
    <c:when test="${requestScope.page.pageTotal<=5}">
        <c:set var="begin" scope="page" value="1"></c:set>
        <c:set var="begin" scope="page" value="${requestScope.page.pageTotal}"></c:set>
    </c:when>
    <c:when test="${requestScope.page.pageTotal>5}">
        <c:choose>
            <c:when test="${requestScope.page.pageNo<=3}">
                <c:set var="begin" value="1"></c:set>
                <c:set var="end" value="5"></c:set>
            </c:when>
            <c:when test="${requestScope.page.pageNo > requestScope.page.pageTotal-3}">
                <c:set var="begin" value="${requestScope.page.pageTotal-4}"></c:set>
                <c:set var="end" value="${requestScope.page.pageTotal}"></c:set>
            </c:when>
            <%--In other cases, display (current page number-2)-(current page number + 2)--%>
            <c:otherwise>
                <c:set var="begin" value="${requestScope.page.pageNo-2}"></c:set>
                <c:set var="end" value="${requestScope. page. pageNo + 2}"></c:set>
            </c:otherwise>
        </c:choose>
    </c:when>
</c:choose>

<c:forEach begin="${begin}" end="${end}" var="i">
    <c:if test="${i==requestScope.page.pageNo}">
        【<span id="pageNo">${<!-- -->i}</span>】
    </c:if>
    <c:if test="${i!=requestScope.page.pageNo}">
        <a href="${requestScope.page.url} &pageNo=${i}">${<!-- -->i}</a>
    </c:if>
</c:forEach>

4. Overall Analysis
|– The function of paging display: In practice, all the data will not be displayed together, it takes time to load and the efficiency is low, so paging display needs to be considered
Pagination class:

public class Page<T> {<!-- -->
    //display data on each page
    public static final Integer PAGE_SIZE = 8;
    // current page number
    private Integer pageNo;
    // total page number
    private Integer pageTotal;
    // current page display quantity
    private Integer pageSize = PAGE_SIZE;
    // total
    private Integer pageTotalCount;
    // current page data
    private List<T> items;
}

javaBean:Page class
DAO part: new methods and new tests in BookDAO
Query the total number of records

@Override
public Integer queryForPageTotalCount() {<!-- -->
    return getValue("select count(*) from t_book").intValue();
}

Query the book data of the current page

@Override
public List<Book> queryForPageItems(int begin, int pageSize) {<!-- -->
    return getBeanList("select * from t_book order by id desc limit ?,?", begin, pageSize);
}
 2) Extraction of paging model Page (current page number, total number of pages, total number of records, current page data, number of records per page)
        Service part, add page() method
        Call DAO in the body of the method to get the database data, and pack the total number of records, the total number of pages, and the current page data into a page object
@Override
    public Page<Book> page(int pageNo, int pageSize) {<!-- -->
        Page<Book> page = new Page<>();
        // set the current page number
        page.setPageNo(pageNo);
        // Set the number of displays per page
        page.setPageSize(pageSize);
        // Find the total number of records
        Integer pageTotalCount = bookDao.queryForPageTotalCount();
        // Set the total number of records
        page.setPageTotalCount(pageTotalCount);
        // set the total page number
        if (page.getPageTotalCount() % page.getPageSize() == 0) {<!-- -->
            //Total number of records/currently displayed number=total number of pages
            page.setPageTotal(page.getPageTotalCount() / pageSize);
        } else {<!-- -->
            page.setPageTotal(page.getPageTotalCount() / pageSize + 1);
        }
        // Calculate the starting page by the current page and the display number of each page
        int begin = (page. getPageNo() - 1) * page. getPageSize();
        // Find current page data
        List<Book> items = bookDao. queryForPageItems(begin, page. getPageSize());
        // set current page data
        page.setItems(items);
        return page;
    }

In the Servlet part, add a page part to obtain the information of the user interaction page, and call the service to realize the function: obtain the current page number, page display quantity pagesize; pass the display data

 protected void page(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {<!-- -->
        //1 Get the requested parameters pageNo and pageSize
        int pageNo = WebUtils. parseInt(req. getParameter("pageNo"), 1);
        int pageSize = WebUtils. parseInt(req. getParameter("pageSize"), Page. PAGE_SIZE);
        System.out.println("pageNo = " + pageNo);
        System.out.println("pageSize = " + pageSize);
        //2 call BookService.page(pageNo, pageSize): Page object
        Page<Book> page = bookService. page(pageNo, pageSize);
        //3 Save the Page object to the Request field
        req. setAttribute("page", page);
        System.out.println("page = " + page);
        //4 The request is forwarded to the pages/manager/book_manager.jsp page
        req.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(req, resp);
    }

Final massger_book pagination function:

<div id="page_nav">
  <c:choose>
        <c:when test="${requestScope.page.pageNo>1}">
            <a href="BookServlet?action=page &pageNo=1">Homepage</a>
            <a href="BookServlet?action=page &pageNo=${requestScope.page.pageNo-1}">Previous page</a>
        </c:when>
        <c:otherwise>
            <a style="color: silver">Homepage</a>
            <a style="color: silver">Next page</a>
        </c:otherwise>
    </c:choose>
    <c:choose>
        <c:when test="${requestScope.page.pageTotal<=5}">
            <%--Cycle output these page numbers--%>
            <c:forEach begin="1" end="${requestScope.page.pageTotal}" var="i">
                <%--If it is the current page, it will display [current page number]--%>
                <c:if test="${i == requestScope.page.pageNo}">
                    <span>【${<!-- -->i}】</span>
                </c:if>
                <%--If it is not the current page number, directly display the number, and add a hyperlink to realize the function of jumping--%>
                <c:if test="${i != requestScope.page.pageNo}">
                    <a href="BookServlet?action=page &pageNo=${i}">${<!-- -->i}</a>
                </c:if>
            </c:forEach>
        </c:when>
        <c:when test="${requestScope.page.pageTotal>5}">
            <c:choose>
                <%--page number in the first three, display 1-5--%>
                <c:when test="${requestScope.page.pageNo<=3}">
                    <c:forEach begin="1" end="5" var="i">
                        <%--If it is the current page, it will display [current page number]--%>
                        <c:if test="${i == requestScope.page.pageNo}">
                            <span>【${<!-- -->i}】</span>
                        </c:if>
                        <%--If it is not the current page number, directly display the number, and add a hyperlink to realize the function of jumping--%>
                        <c:if test="${i != requestScope.page.pageNo}">
                            <a href="BookServlet?action=page &pageNo=${i}">${<!-- -->i}</a>
                        </c:if>
                    </c:forEach>
                </c:when>
                <%--The page number is in the last three, displaying (Total-4)-Total--%>
                <c:when test="${requestScope.page.pageNo > requestScope.page.pageTotal-3}">
                    <c:forEach begin="${requestScope.page.pageTotal-4}" end="${requestScope.page.pageTotal}"
                               var="i">
                        <%--If it is the current page, it will display [current page number]--%>
                        <c:if test="${i == requestScope.page.pageNo}">
                            <span>【${<!-- -->i}】</span>
                        </c:if>
                        <%--If it is not the current page number, directly display the number, and add a hyperlink to realize the function of jumping--%>
                        <c:if test="${i != requestScope.page.pageNo}">
                            <a href="BookServlet?action=page &pageNo=${i}">${<!-- -->i}</a>
                        </c:if>
                    </c:forEach>
                </c:when>
                <%--In other cases, display (current page number-2)-(current page number + 2)--%>
                <c:otherwise>
                    <c:forEach begin="${requestScope.page.pageNo-2}" end="${requestScope.page.pageNo + 2}" var="i">
                        <%--If it is the current page, it will display [current page number]--%>
                        <c:if test="${i == requestScope.page.pageNo}">
                            <span>【${<!-- -->i}】</span>
                        </c:if>
                        <%--If it is not the current page number, directly display the number, and add a hyperlink to realize the function of jumping--%>
                        <c:if test="${i != requestScope.page.pageNo}">
                            <a href="BookServlet?action=page &pageNo=${i}">${<!-- -->i}</a>
                        </c:if>
                    </c:forEach>
                </c:otherwise>
            </c:choose>
        </c:when>
    </c:choose>
    <a class="aclass" href="BookServlet?action=page &pageNo=${requestScope.page.pageNo + 1}">next page</a>
    <a class="aclass" href="BookServlet?action=page & amp;pageNo=${requestScope.page.pageTotal}">Last page</a>
    <input type="hidden" id="pageNo" value="${requestScope.page.pageNo}">
    Total <span id="pageTotal">${<!-- --> requestScope.page.pageTotal}</span> pages, ${<!-- -->requestScope.page.pageTotalCount} records
    Go to page <input value="${requestScope.page.pageNo}" name="pn" id="pn_input"/>
    <input type="button" value="OK" id="inputbtn">
</div>
<script type="text/javascript">
    $("#inputbtn").click(function () {<!-- -->
        location.href = "BookServlet?action=page & pageNo=" + $("#pn_input").val();
    });
    $(function () {<!-- -->
        var pageNo = parseInt($("#pageNo"). val());
        var pageTotal = parseInt($("#pageTotal").html());
        if (pageNo >= pageTotal) {<!-- -->
            $("a.aclass").removeAttr("href").css("color", "silver");
        }
    });
</script>