ssm使用pageHelper进行分页

最新推荐文章于 2022-06-11 20:24:13 发布

咻咻咻0v0

最新推荐文章于 2022-06-11 20:24:13 发布

阅读量943

点赞数 1

CC 4.0 BY-SA版权

分类专栏： # 前端展示 # ssm项目--学生班级增删改查分页文章标签： java 开发语言 ssm

本文链接：https://blog.csdn.net/weixin_46486508/article/details/122318047

前端展示同时被 2 个专栏收录

3 篇文章

订阅专栏

ssm项目--学生班级增删改查分页

1 篇文章

订阅专栏

本文详细介绍了如何在Spring Boot项目中集成PageHelper分页插件，包括在pom.xml、mybatis-config.xml和spring-config.xml中的配置，以及在Controller和前端页面的使用实例，确保了分页功能的实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最终效果：

分页所需的五处配置：

一.引入对应的pom文件

    <dependency>
      <groupId>com.github.pagehelper</groupId>
      <artifactId>pagehelper</artifactId>
      <version>5.3.0</version>
    </dependency>

二.修改mybatis-config.xml配置文件

<!-- 配置分页插件 -->
    <!--<!–分页参数合理化  –>-->
    <plugins>
        <plugin interceptor="com.github.pagehelper.PageInterceptor">
            <property name="reasonable" value="true"/>
        </plugin>
    </plugins>

三.修改spring-config.xml配置文件

        <property name="plugins">
            <array>
                <bean class="com.github.pagehelper.PageInterceptor">
                    <property name="properties">
                        <props>
                            <prop key="helperDialect">mysql</prop>
                            <prop key="reasonable">true</prop>
                        </props>
                    </property>
                </bean>
            </array>
        </property>

此配置在spring-config.xml配置文件的对应位置为（以下为spring-config.xml完整代码）：

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:aop="http://www.springframework.org/schema/aop"
       xmlns:tx="http://www.springframework.org/schema/tx"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
	http://www.springframework.org/schema/beans/spring-beans.xsd
	http://www.springframework.org/schema/context
	http://www.springframework.org/schema/context/spring-context.xsd">
    <!--开启注解的扫描，希望处理service和dao，controller不需要Spring框架去处理-->
    <context:component-scan base-package="com.sgxy.ssm">
        <!--配置哪些注解不扫描-->
        <context:exclude-filter type="annotation" expression="org.springframework.stereotype.Controller"/>
    </context:component-scan>

    <context:property-placeholder location="classpath:db.properties"/>

    <bean class="com.alibaba.druid.pool.DruidDataSource" id="dataSource">
        <property name="driverClassName" value="${jdbc.driver}"></property>
        <property name="url" value="${jdbc.url}"></property>
        <property name="username" value="${jdbc.username}"></property>
        <property name="password" value="${jdbc.password}"></property>
    </bean>

    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="typeAliasesPackage" value="com.sgxy.ssm.entity"/>
        <property name="dataSource" ref="dataSource"/>
        <!--        <property name="configLocation" value="classpath:mybatis-config.xml"/>-->
        <!--当mybatis的xml文件和mapper接口不在相同包下时，需要用mapperLocations属性指定xml文件的路径。-->
        <!--<property name="mapperLocations" value="classpath:com/sgxy/ssm/mapper/*.xml"/>-->
        <property name="configuration">
            <bean class="org.apache.ibatis.session.Configuration">
                <property name="mapUnderscoreToCamelCase" value="true"/>
                <property name="logImpl" value="org.apache.ibatis.logging.stdout.StdOutImpl"/>
            </bean>
        </property>

        <property name="plugins">
            <array>
                <bean class="com.github.pagehelper.PageInterceptor">
                    <property name="properties">
                        <props>
                            <prop key="helperDialect">mysql</prop>
                            <prop key="reasonable">true</prop>
                        </props>
                    </property>
                </bean>
            </array>
        </property>

    </bean>

    <!--配置mapper接口所在包-->
    <bean id="mapperScanner" class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <!--但是当mybatis的xml文件和mapper接口在相同包下时，不需要配置mapperLocations属性指定xml文件的路径-->
        <property name="basePackage" value="com.sgxy.ssm.mapper"/>
    </bean>


</beans>

四.controller类中

//    localhost:8080/ssm/index
    @RequestMapping("/list")
    public String selectAllStudents(@RequestParam(value = "pn",defaultValue = "1")Integer pn,
                                    Model m) {
        //引入分页查询，使用PageHelper分页功能
        //在查询之前传入当前页，然后多少记录
        PageHelper.startPage(pn,8);
        //startPage后紧跟的这个查询就是分页查询
        List<Student> students = studentService.selectAllStudents();
        //使用PageInfo包装查询结果，只需要将pageInfo交给页面就可以
        PageInfo pageInfo = new PageInfo(students,5);
        //pageINfo封装了分页的详细信息，也可以指定连续显示的页数
        m.addAttribute("pageInfo",pageInfo);
        return "list";
    }

按理说此方法放在service层中更加合理

五.前端页面代码修改（list.jsp页面完整代码）

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: CJY
  Date: 2022/1/3
  Time: 17:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>学生信息</title>
    <%
        pageContext.setAttribute("APP_PATH", request.getContextPath());
    %>
    <script type="text/javascript"	src="${APP_PATH }/static/js/jquery-3.3.1.min.js"></script>
    <link href="${APP_PATH }/static/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script	src="${APP_PATH }/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <!-- 标题 -->
    <div class="row">
        <div class="col-md-12">
            <h1>对学生信息进行增删改查</h1>
        </div>
    </div>
    <form class="form-inline" action="/findStudentByClass">
        <div class="form-group">
            <label for="studentName">学生姓名</label>
            <input type="text" class="form-control" id="studentName" placeholder="studentName">
        </div>
        <div class="form-group">
            <label for="studentClass">所在班级</label>
            <select class="form-control" id="studentClass" placeholder="所有班级" name="studentClass">
                <option name="scid" value="1">软工1班</option>
                <option name="scid" value="2">软工2班</option>
                <option name="scid" value="3">软工3班</option>
            </select>
        </div>
        <button type="submit" class="btn btn-success btn-sm">
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
<%--            <c:forEach items="${pageInfo.list}" var="stu">--%>
            <a href="/findStudentByClass?scid=1" style="color: white" >
                搜索
            </a>
<%--            </c:forEach>--%>
        </button>
        <div class="row">
            <div class="col-md-4 col-md-offset-8">
                <button class="btn btn-primary"><a href="/toAddStudent" style="color: white">新增(页面跳转)</a></button>
                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#toAddStudent"
                        data-whatever="@mdo">新增（模态框）</button>
                <button class="btn btn-danger">批量删除</button>
            </div>
        </div>
    </form>

    <!-- 显示表格数据 -->
    <div class="row">
        <div class="col-md-12">
            <table class="table table-striped" id="students_table">
                <tr>
                    <td>学号</td>
                    <td>姓名</td>
                    <td>性别</td>
                    <td>邮箱</td>
                    <td>班级</td>
                    <td>操作</td>
                </tr>
                <c:forEach items="${pageInfo.list}" var="stu">
                    <tr>
                        <td>${stu.sid}</td>
                        <td>${stu.sname}</td>
                        <td>${stu.ssex=="0"?"男":"女"}</td>
                        <td>${stu.semail}</td>
                        <td>${stu.scid=="1"?"软工1班":(stu.scid=="2"?"软工2班":"软工3班")}</td>
                        <td>
                            <button class="btn btn-primary btn-sm">
                                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
<%--                                <a href="${APP_PATH }/toUpdateStudent" style="color: white">编辑</a>--%>
                                <a href="${APP_PATH}/toUpdateStudent?${stu.sid}" style="color: white">编辑</a>
                            </button>
                            <button class="btn btn-danger btn-sm">
                                <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
<%--                                <a href="/deleteStudentById" style="color: white" onclick="return confirm('你确定要删除该学生的所有信息吗')">--%>
                                <a href="${APP_PATH}/deleteStudentById?sid=${stu.sid}" style="color: white" onclick="return confirm('你确定要删除该学生的所有信息吗')">
                                删除
                                </a>
                            </button>
                        </td>
                    </tr>
                </c:forEach>
            </table>
        </div>
    </div>

    <!--显示分页信息-->
    <div class="row">
        <!--文字信息-->
        <div class="col-md-6">
            当前第 ${pageInfo.pageNum} 页.总共 ${pageInfo.pages} 页.一共 ${pageInfo.total} 条记录
        </div>

        <!--点击分页-->
        <div class="col-md-6">
            <nav aria-label="Page navigation">
                <ul class="pagination">

                    <li><a href="${APP_PATH}/list?pn=1">首页</a></li>

                    <!--上一页-->
                    <li>
                        <c:if test="${pageInfo.hasPreviousPage}">
                            <a href="${pageContext.request.contextPath}/list?pn=${pageInfo.pageNum-1}" aria-label="Previous">
                                <span aria-hidden="true">«</span>
                            </a>
                        </c:if>
                    </li>

                    <!--循环遍历连续显示的页面，若是当前页就高亮显示，并且没有链接-->
                    <c:forEach items="${pageInfo.navigatepageNums}" var="page_num">
                        <c:if test="${page_num == pageInfo.pageNum}">
                            <li class="active"><a href="#">${page_num}</a></li>
                        </c:if>
                        <c:if test="${page_num != pageInfo.pageNum}">
                            <li><a href="${pageContext.request.contextPath}/list?pn=${page_num}">${page_num}</a></li>
                        </c:if>
                    </c:forEach>

                    <!--下一页-->
                    <li>
                        <c:if test="${pageInfo.hasNextPage}">
                            <a href="${pageContext.request.contextPath}/list?pn=${pageInfo.pageNum+1}"
                               aria-label="Next">
                                <span aria-hidden="true">»</span>
                            </a>
                        </c:if>
                    </li>

                    <li><a href="${pageContext.request.contextPath}/list?pn=${pageInfo.pages}">尾页</a></li>
                </ul>
            </nav>
        </div>

    </div>

    <!--模态框-->
    <div class="modal fade" id="toAddStudent" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel">添加学生</h4>
                </div>
                <form action="/addStudent" method="post">
                <div class="modal-body">
                    <div class="form-group">
                        <label for="sid" class="control-label">学号:</label>
                        <input type="text" name="sid" class="form-control" id="sid">
                    </div>
                    <div class="form-group">
                        <label for="sname" class="control-label">姓名:</label>
                        <input type="text" name="sname" class="form-control" id="sname">
                    </div>
                    <div class="form-group">
                        <%--@declare id="ssex"--%><label for="ssex" class="control-label">性别:</label>
                        <input type="radio" name="ssex" id="ssexRadio1" value="0"> 男
                        <input type="radio" name="ssex"  id="ssexRadio2" value="1"> 女 <br>
                    </div>
                    <div class="form-group">
                        <label for="semail" class="control-label">邮箱:</label>
                        <input type="text" name="semail" class="form-control" id="semail">
                    </div>
                    <div class="form-group">
                        <%--@declare id="scid"--%><label for="scid" class="control-label">班级:</label>
                        <input type="radio" name="scid" id="inlineRadio1" value="1"> 软工1班
                        <input type="radio" name="scid" id="inlineRadio2" value="2"> 软工2班
                        <input type="radio" name="scid" id="inlineRadio3" value="3"> 软工3班 <br>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="submit" class="btn btn-primary" ><a href="/addStudent" style="color: white">提交</a></button>
                </div>
                </form>
            </div>
        </div>
    </div>

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

原来效果：

最终效果：