JSP分页显示的实例代码

JSP分页是指将大量数据分为多页进行展示,提高用户体验并减少服务器压力。下面将详细讲解如何实现JSP分页显示,以及两个示例说明。

一、分页的基本思路

  1. 在JSP页面中,使用SQL语句查询出所有数据数量;
  2. 计算总页数,每页显示数据数量,以及当前页码;
  3. 使用SQL语句查询出当前页码的数据;
  4. 在JSP页面中循环显示当前页码的数据,并在页面上添加分页控件。

二、实现步骤

1. 数据库准备

假设我们需要对一张名为user的表进行分页显示。表中包含idname两个字段。

2. 在JSP页面中进行查询

在JSP页面中编写SQL查询语句,查询出数据库中数据的总数量,并将其存储到totalCount变量中。

<%
    Connection conn = null;
    PreparedStatement ps = null;
    ResultSet rs = null;

    String sql = "SELECT COUNT(*) FROM user";

    try {
        Class.forName("com.mysql.jdbc.Driver");
        conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "password");
        ps = conn.prepareStatement(sql);
        rs = ps.executeQuery();
        if (rs.next()) {
            int totalCount = rs.getInt(1);
        }
    } catch (Exception e) {
        e.printStackTrace();
    } finally {
        // 关闭数据库连接
    }
%>

3. 分页计算

计算总页数,每页显示数据数量以及当前页码,并将其存储到相应的变量中。这里我们设定每页显示5条数据。

<%
    int pageSize = 5;
    int currentPage = 1;
    int totalCount = 0;
    int totalPage = 0;

    // 上面查询数据库的代码

    if (request.getParameter("currentPage") != null) {
        currentPage = Integer.parseInt(request.getParameter("currentPage"));
    }

    totalPage = (totalCount + pageSize - 1) / pageSize;
%>

4. 查询当前页码数据

根据当前页码和每页显示数据数量,在SQL语句中加上LIMIT限制条件,从数据库中查询出当前页码的数据。

<%
    String sql = "SELECT * FROM user LIMIT ?, ?";
    int start = (currentPage - 1) * pageSize;
    ps = conn.prepareStatement(sql);
    ps.setInt(1, start);
    ps.setInt(2, pageSize);
    rs = ps.executeQuery();

    while (rs.next()) {
        int id = rs.getInt("id");
        String name = rs.getString("name");
        // 将数据展示到页面上
    }
%>

5. 分页控件的实现

在页面上以列表的形式展示数据,并在底部添加分页的控件。通常的分页控件有“上一页”、“下一页”、“首页”、“尾页”和页码数字等。这里以Bootstrap为例实现一个简单的分页控件。

<nav aria-label="Page navigation">
  <ul class="pagination">
    <li <% if (currentPage == 1) { %>class="disabled"<% } %>>
      <a href="/index.jsp?currentPage=<%= currentPage - 1 %>" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
      </a>
    </li>
    <% for (int i = 1; i <= totalPage; i++) { %>
    <li <% if (i == currentPage) { %>class="active"<% } %>>
      <a href="/index.jsp?currentPage=<%= i %>"><%= i %></a>
    </li>
    <% } %>
    <li <% if (currentPage == totalPage) { %>class="disabled"<% } %>>
      <a href="/index.jsp?currentPage=<%= currentPage + 1 %>" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
      </a>
    </li>
  </ul>
</nav>

三、示例说明

示例1:分页查询学生信息

我们需要将一张名为student的表进行分页展示,其中包含字段idnameagescore。并按照分数从高到低进行排序。

具体实现过程如下:

  1. 在JSP页面中,使用SQL语句查询出所有学生数据数量;
  2. 计算总页数,每页显示10条数据,以及当前页码;
  3. 使用SQL语句查询出当前页码的学生数据,并按照分数从高到低排序;
  4. 在JSP页面中循环显示当前页码的学生数据,并在页面上添加分页控件。

示例代码如下:

<%
    Connection conn = null;
    PreparedStatement ps = null;
    ResultSet rs = null;

    String sql = "SELECT COUNT(*) FROM student";

    try {
        Class.forName("com.mysql.jdbc.Driver");
        conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "password");
        ps = conn.prepareStatement(sql);
        rs = ps.executeQuery();
        if (rs.next()) {
            int totalCount = rs.getInt(1);
        }
    } catch (Exception e) {
        e.printStackTrace();
    } finally {
        // 关闭数据库连接
    }

    int pageSize = 10;
    int currentPage = 1;
    int totalPage = 0;

    if (request.getParameter("currentPage") != null) {
        currentPage = Integer.parseInt(request.getParameter("currentPage"));
    }

    totalPage = (totalCount + pageSize - 1) / pageSize;

    sql = "SELECT * FROM student ORDER BY score DESC LIMIT ?, ?";
    int start = (currentPage - 1) * pageSize;
    ps = conn.prepareStatement(sql);
    ps.setInt(1, start);
    ps.setInt(2, pageSize);
    rs = ps.executeQuery();

    while (rs.next()) {
        int id = rs.getInt("id");
        String name = rs.getString("name");
        int age = rs.getInt("age");
        float score = rs.getFloat("score");
        // 将数据展示到页面上
    }
%>

<nav aria-label="Page navigation">
  <ul class="pagination">
    <li <% if (currentPage == 1) { %>class="disabled"<% } %>>
      <a href="/student.jsp?currentPage=<%= currentPage - 1 %>" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
      </a>
    </li>
    <% for (int i = 1; i <= totalPage; i++) { %>
    <li <% if (i == currentPage) { %>class="active"<% } %>>
      <a href="/student.jsp?currentPage=<%= i %>"><%= i %></a>
    </li>
    <% } %>
    <li <% if (currentPage == totalPage) { %>class="disabled"<% } %>>
      <a href="/student.jsp?currentPage=<%= currentPage + 1 %>" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
      </a>
    </li>
  </ul>
</nav>

示例2:分页查询商品信息

我们需要将一张名为goods的表进行分页展示,其中包含字段idnamepriceimage。并按照价格从低到高进行排序。

具体实现过程如下:

  1. 在JSP页面中,使用SQL语句查询出所有商品数据数量;
  2. 计算总页数,每页显示20条数据,以及当前页码;
  3. 使用SQL语句查询出当前页码的商品数据,并按照价格从低到高排序;
  4. 在JSP页面中循环显示当前页码的商品数据,并在页面上添加分页控件。

示例代码如下:

<%
    Connection conn = null;
    PreparedStatement ps = null;
    ResultSet rs = null;

    String sql = "SELECT COUNT(*) FROM goods";

    try {
        Class.forName("com.mysql.jdbc.Driver");
        conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "password");
        ps = conn.prepareStatement(sql);
        rs = ps.executeQuery();
        if (rs.next()) {
            int totalCount = rs.getInt(1);
        }
    } catch (Exception e) {
        e.printStackTrace();
    } finally {
        // 关闭数据库连接
    }

    int pageSize = 20;
    int currentPage = 1;
    int totalPage = 0;

    if (request.getParameter("currentPage") != null) {
        currentPage = Integer.parseInt(request.getParameter("currentPage"));
    }

    totalPage = (totalCount + pageSize - 1) / pageSize;

    sql = "SELECT * FROM goods ORDER BY price ASC LIMIT ?, ?";
    int start = (currentPage - 1) * pageSize;
    ps = conn.prepareStatement(sql);
    ps.setInt(1, start);
    ps.setInt(2, pageSize);
    rs = ps.executeQuery();

    while (rs.next()) {
        int id = rs.getInt("id");
        String name = rs.getString("name");
        float price = rs.getFloat("price");
        String image = rs.getString("image");
        // 将数据展示到页面上
    }
%>

<nav aria-label="Page navigation">
  <ul class="pagination">
    <li <% if (currentPage == 1) { %>class="disabled"<% } %>>
      <a href="/goods.jsp?currentPage=<%= currentPage - 1 %>" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
      </a>
    </li>
    <% for (int i = 1; i <= totalPage; i++) { %>
    <li <% if (i == currentPage) { %>class="active"<% } %>>
      <a href="/goods.jsp?currentPage=<%= i %>"><%= i %></a>
    </li>
    <% } %>
    <li <% if (currentPage == totalPage) { %>class="disabled"<% } %>>
      <a href="/goods.jsp?currentPage=<%= currentPage + 1 %>" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
      </a>
    </li>
  </ul>
</nav>

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JSP分页显示的实例代码 - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • HTML注释的写法(附带示例)

    HTML注释是一种特殊的语法,它通常被用于在HTML文档中注释一些内容。在网页开发中,注释是一种非常有用的方式,可以让其他的开发者和自己更好地理解文档结构,也方便我们在调试代码时做一些标注。 以下是HTML注释的写法和示例: 注释单行内容 注释单行内容的方法是在要注释的内容前加上“”符号。注意,注释符号中间不要加空格。 <p>这是一个段落<…

    Web开发基础 2023年3月15日
    00
  • CSS教程:媒体类别语法

    CSS教程:媒体类别语法 什么是媒体类别 媒体类别(Media Queries)就是一种用于查询设备特征和状态的CSS语法。通过媒体类别,我们能够针对不同的设备屏幕大小、分辨率、浏览器类型等等,为网站提供不同的CSS样式,使网站在不同设备上拥有更好的用户体验。 如何使用媒体类别 使用媒体类别,需要将CSS规则套用在一个@media规则块中。一个@media规…

    css 2023年6月9日
    00
  • CSS 三栏等高布局实现方法

    CSS三栏等高布局实现方法 在Web开发中,三栏等高布局是一种常见的布局方式。本攻略将详细讲解CSS三栏等高布局的实现方法,包括基本原理、使用方法和示例说明。 1. 基本原理 CSS三栏等高布局的基本原理是通过使用CSS的float属性和clear属性来实现。具体来说,可以将三个元素分别设置为左浮动、右浮动和不浮动,并使用clear属性来清除浮动,从而实现三…

    css 2023年5月18日
    00
  • LayUI下拉树TreeSelect的使用解读

    在这里我会给大家讲解 “LayUI下拉树TreeSelect的使用解读”,并提供两个示例供大家参考。 1. 简介 LayUI 是一款基于 HTML5 和 CSS3 的前端 UI 框架,它本身提供了许多实用的组件,其中之一就是 TreeSelect,它是一种可以提供下拉树选择功能的组件。 通过 TreeSelect 组件,我们可以方便地实现下拉树结构的选择功能…

    css 2023年6月9日
    00
  • HTML+CSS3模拟心的跳动实例代码

    下面是“HTML+CSS3模拟心的跳动实例代码”的完整攻略: 1. 实例介绍 本实例是通过 HTML 和 CSS3 实现一个可爱的心形图案,并让它跳动动态展示。具体实现过程如下: 2. 实现步骤 2.1 第一步:HTML 代码编写 <div class="heart-container"> <div class=&quo…

    css 2023年6月9日
    00
  • 拉动滚动条加载数据的jquery代码

    要实现拉动滚动条加载数据的效果,可以使用jQuery实现。具体的实现步骤如下: 1. 监听滚动条事件 使用jQuery的scroll()函数监听滚动条事件,判断用户是否滚动到页面底部。代码如下: $(window).scroll(function() { // 判断是否滚动到页面底部 if($(document).scrollTop() >= $(do…

    css 2023年6月10日
    00
  • jquery弹窗时禁止body滚动条滚动的例子

    请参考以下攻略,包含两个示例说明。 攻略 当使用jQuery弹出框或模态框时,为了确保用户集中精力处理弹出框中的信息,我们通常要禁止页面的滚动。 一种简单的解决方法是通过禁止body元素的滚动来实现。我们可以使用CSS和JavaScript来实现这一目的。 示例如下: 1. CSS方式: /* 禁止body元素滚动 */ body.modal-open { …

    css 2023年6月10日
    00
  • CSS元素的6种显示类型

    CSS元素显示类型是指一个HTML元素在页面上以什么样的方式呈现。在CSS中,元素显示类型分为以下几种: 块级元素(Block) 块级元素以块的形式展现在页面上,每个块级元素都会自动换行。块级元素可以包含内联元素和其他块级元素。常见的块级元素包括div、h1、p等。 代码示例: <div>This is a block level element…

    Web开发基础 2023年3月20日
    00
合作推广
合作推广
分享本页
返回顶部