SSM--之用Bootstrap插件实现分页

最新推荐文章于 2025-05-07 11:04:14 发布

原创最新推荐文章于 2025-05-07 11:04:14 发布 · 1.3k 阅读

1 ·

CC 4.0 BY-SA版权

ssm 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了如何在SSM项目中结合Bootstrap和PageHelper进行分页功能的实现。首先，需要在SqlMapconfig.xml配置文件中引入pagehelper-5.0.0.jar和jsqlparser-0.9.5.jar这两个必要的jar包。然后，在后台进行相关配置，最后展示如何在前台展示分页效果。

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

1，首先需要在SqlMapconfig.xml配置文件中配置


    <plugins>
        <!-- com.github.pagehelper为PageHelper类所在包名 -->
        <plugin interceptor="com.github.pagehelper.PageInterceptor">
            <!-- 使用下面的方式配置参数，后面会有所有的参数介绍 -->
            <!-- 分页合理化参数，默认值为false。当该参数设置为 true 时，pageNum<=0 时会查询第一页，
             pageNum>pages（超过总数时），会查询最后一页。默认false 时，直接根据参数进行查询 -->
            <property name="reasonable" value="true"/>
        </plugin>
    </plugins>

需要的jar包
pagehelper-5.0.0.jar
jsqlparser-0.9.5.jar

2,后台

    @RequestMapping("select.do")
    public String sss(@RequestParam(value="pageno",defaultValue="1")Integer pageno,
            @RequestParam(value="pagesize",defaultValue="3")Integer pagesize,Model model){
        PageHelper.startPage(pageno, pagesize);
        List<Address> list = userMapper.selectAddress();
        System.out.println(list.size());
        PageInfo<Address> pageinfo = new PageInfo<>(list);
        model.addAttribute("adds", pageinfo);
        return "reg";
    }

前台

<div class="container">
    <table class="table table-hover">
        <tr>
            <td>编号</td><td>地址<td>
        </tr>
        <c:forEach items="${adds.list }" var="a">
        <tr>
            <td>${a.aid }</td><td>${a.aname }<td>
        </tr>
        </c:forEach>    
    </table>
     <!-- 分页条 -->
        <div class="row">
            <div class="col-md-6">共有${adds.total}条数据,共有${adds.pages}页</div>

            <nav aria-label="Page navigation">
              <ul class="pagination">
                <li ng-show="adds.hasPreviousPage"><a href="select.do?pageno=1">首页</a></li>
                <li>
                  <a ng-show="adds.hasPreviousPage" href="/select.do?pageno=${adds.pageNum-1}"  aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                  </a>
                </li>
                <li>
                  <a ng-hide="pageInfo.hasPreviousPage" href="#"  aria-label="Previous" class="disabled">
                    <span aria-hidden="true">&laquo;</span>
                  </a>
                </li>
                <li ng-repeat="num in adds.navigatepageNums" ng-class="num==adds.pageNum?'active':''">
                    <a href="#" >${adds.pageNum}</a>
                </li>
                <li>
                  <a href="select.do?pageno=${adds.pageNum+1}" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                  </a>
                </li>
                <li><a href="#" ng-click="toPage(adds.pages)">尾页</a></li>
              </ul>
            </nav>
        </div>

</div>