在javaweb的jsp页面实现分页功能

unoliiskam

于 2024-08-01 19:31:57 发布

阅读量703

点赞数 15

文章标签： mybatis java jsp servlet

本文链接：https://blog.csdn.net/2301_76908023/article/details/140854793

版权

一、思路：

设计前端页面所呈现的分页功能，再在jsp中接取后端中获取其中的数据，再设置设定每一的记录数，计算总的记录数，分页的总页数，当前页数，再设置当前页数所对应的记录信息，再将这些信息传递给jsp中的页面上取值（注意当记录数目不足规定的记录数时，应该设置向上取整，这样就可以取出所有的数据了）

二、JavaWeb数据展示页面的代码：

<%@ page import="java.util.List"%>
<%@ page import="Model.Student"%>
<%@ page import="Dao.StudentDao"%>
<%@ page import="java.io.InputStream"%>
<%@ page import="org.apache.ibatis.session.SqlSession" %>
<%@ page import="org.apache.ibatis.io.Resources" %>
<%@ page import="org.apache.ibatis.session.SqlSessionFactory" %>
<%@ page import="org.apache.ibatis.session.SqlSessionFactoryBuilder" %><%--
  Created by IntelliJ IDEA.
  User: 86173
  Date: 2024/8/1
  Time: 10:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>学生管理系统</title>
    <style>
        body { font-family: '微软雅黑'; background-color: #e0f7fa; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; margin-top: 150px;}
        .container { background-color: #ffffff; padding: 30px; border-radius: 12px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); width: 90%; max-width: 800px; text-align: center; }
        h1 { color: #00796b; margin-bottom: 20px; }
        .btn { display: block; width: 100%; padding: 12px; margin: 10px 0; font-size: 18px; color: #ffffff; background-color: #00796b; border: none; border-radius: 6px; cursor: pointer; }
        .btn:hover { background-color: #004d40; }
        table { width: 100%; border-collapse: collapse; margin-top: 20px; }
        th, td { border: 1px solid #ddd; padding: 12px; text-align: left; }
        th { background-color: #e0f7fa; color: black; }
        tr:nth-child(even) { background-color: lightyellow; }
        tr:hover { background-color: #e0f7fa; }
        .pa { margin-top: 20px; }
        .pa a { margin: 0 5px; padding: 8px 16px; text-decoration: none; color: #00796b; border: 1px solid #00796b; border-radius: 5px; }
        .pa a:hover { background-color: #00796b; color: white; }
        .pa a.disabled { color: gray; border-color: gray; pointer-events: none; }
        a { text-decoration: none;color: #00796b; font-weight: bold; }
    </style>
</head>
<body>
<%
    InputStream in = null;
    SqlSession sqlSession = null;
    in = Resources.getResourceAsStream("config/mybatis_config.xml");
    SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(in);
    sqlSession = sqlSessionFactory.openSession();
    StudentDao mapper = sqlSession.getMapper(StudentDao.class);
    //1.设定每一的记录数
    int pageSize=3;
    //2.计算总的记录数
    int recordCountTotal = mapper.findAll2();
    //3.分页的总页数
    int pagCount = (int)Math.ceil(recordCountTotal *1.0 / pageSize);
    //当前页数
    Integer curPage=null;
    if (request.getParameter("curPage")==null){
        curPage=1;
    }else {
        curPage= Integer.valueOf(request.getParameter("curPage"));
    }
    int start=(curPage-1)*pageSize;

    List<Student> all1 = mapper.showStuPage(start,pageSize);

%>
<div class='container'>
    <h1>学生信息管理</h1>
    <div><a href='insertStudent.jsp'>添加信息</a></div>
    <table>
        <tr><th>id</th><th>姓名</th><th>性别</th><th>年龄</th><th>专业</th><th>时间</th><th>操作一</th><th>操作二</th></tr>
        <%
            for (int i = 0; i <all1.size() ; i++) {
        %>
        <tr>
            <td><%=all1.get(i).getId()%></td>
            <td><%=all1.get(i).getName()%></td>
            <td><%=all1.get(i).getSex()%></td>
            <td><%=all1.get(i).getAge()%></td>
            <td><%=all1.get(i).getMajor()%></td>
            <td><%=all1.get(i).getTime()%></td>
            <td><a onclick=if(confirm('确定删除吗？'))return true; return false; href=delone?id=<%=all1.get(i).getId()%>>删除</a></td>
            <td><a href=update.jsp?id=<%=all1.get(i).getId()%>>更新</a></td>
<%--            <a onclick=\"if(confirm('确定删除吗？')) return true; return false;\" href=delone?id="+all.get(i).getId()+">删除</a>--%>
        </tr>
        <%
            }
        %>
    </table>
    <div class="pa">
        <% if (curPage > 1) { %>
        <a href="showlist1.jsp?curPage=1">首页</a>
        <a href="showlist1.jsp?curPage=<%= curPage - 1 %>">上一页</a>
        <% } else { %>
        <a class="disabled">首页</a>
        <a class="disabled">上一页</a>
        <% } %>

        <% if (curPage < pagCount) { %>
        <a href="showlist1.jsp?curPage=<%= curPage + 1 %>">下一页</a>
        <a href="showlist1.jsp?curPage=<%= pagCount %>">尾页</a>
        <% } else { %>
        <a class="disabled">下一页</a>
        <a class="disabled">尾页</a>
        <% } %>

    </div>
</div>
</body>
</html>

三、接口代码：（注解的方式）

代码解释：

1.第一个是查找并且限制当前页面记录数

2.第二个方法是查出所有的表中记录作为计算的总的记录数，（在一些情况中传过来的记录数不能够计算出来的总记录数）

3.sql语句中，注意第一句中参数的传递，第一个是当前记录数，第二个是每一个页面的所拥有的记录数

    @Select("select * from student limit #{start}, #{pageSize}")
    List<Student> showStuPage(@Param("start") int start, @Param("pageSize") int pageSize);
    @Select("select count(*) from student")
    int findAll2();