PageHelper基于adminLTE写的一个分页功能

2 篇文章 0 订阅

PageHelper基于adminLTE写的一个分页功能

**

分页效果:

始终显示五个页码,到了末页和首页时,禁用首页末页跳转
**
在这里插入图片描述
在这里插入图片描述

代码:

 <div class="box-footer">
                    <div class="pull-left">
                        <div class="form-group form-inline">
                            总共${pageInfo.pages}页,共${pageInfo.total} 条数据。 每页
                            <input id="changePageSize" style="width: 40px" type="text"
                                   placeholder="${pageInfo.pageSize}"/>条数据
                        </div>
                    </div>

                    <div class="box-tools pull-right">
                        <ul class="pagination">
                            <li <c:if test="${pageInfo.pageNum==1}">class="disabled" </c:if>>
                                <a href="${pageContext.request.contextPath}/product/findAll.do?page=1&size=${pageInfo.pageSize}"
                                   aria-label="Previous">首页</a></li>
                            <li <c:if test="${pageInfo.pageNum==1}">class="disabled" </c:if>>
                                <a href="${pageContext.request.contextPath}/product/findAll.do?page=${pageInfo.pageNum-1}&size=${pageInfo.pageSize}">上一页</a>
                            </li>

                            <c:choose>
                                <c:when test="${pageInfo.pages>=5}">
                                    <%--在页面展示出5条页码数--%>
                                    <c:forEach
                                            begin="${pageInfo.pageNum>=pageInfo.pages-4?pageInfo.pages-4:pageInfo.pageNum}"
                                            end="${pageInfo.pageNum<=pageInfo.pages-4?pageInfo.pageNum+4:pageInfo.pages}"
                                            var="pageNum">
                                        <li
                                            <%--显示当前选中的页数--%>
                                                <c:if test="${pageInfo.pageNum == pageNum}">class="active" </c:if>
                                        >
                                            <a href="${pageContext.request.contextPath}/product/findAll.do?page=${pageNum}&size=${pageInfo.pageSize}">${pageNum}</a>
                                        </li>
                                    </c:forEach>
                                </c:when>
                                <%--数据过少,页码小于5页时--%>
                                <c:when test="${pageInfo.pages<5}">
                                    <%--在页面展示出5条页码数--%>
                                    <c:forEach
                                            begin="1"
                                            end="${pageInfo.pages}"
                                            var="pageNum">
                                        <li
                                            <%--显示当前选中的页数--%>
                                                <c:if test="${pageInfo.pageNum == pageNum}">class="active" </c:if>
                                        >
                                            <a href="${pageContext.request.contextPath}/product/findAll.do?page=${pageNum}&size=${pageInfo.pageSize}">${pageNum}</a>
                                        </li>
                                    </c:forEach>
                                </c:when>
                            </c:choose>
                            <li <c:if test="${pageInfo.pageNum==pageInfo.pages}">class="disabled" </c:if>>
                                <a href="${pageContext.request.contextPath}/product/findAll.do?page=${pageInfo.pageNum+1}&size=${pageInfo.pageSize}">下一页</a>
                            </li>
                            <li <c:if test="${pageInfo.pageNum==pageInfo.pages}">class="disabled" </c:if>>
                                <a href="${pageContext.request.contextPath}/product/findAll.do?page=${pageInfo.pages}&size=${pageInfo.pageSize}"
                                   aria-label="Next">尾页</a></li>
                        </ul>
                    </div>

                </div>

配置中要开启为true,否则会乱页码

在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值