bootstrap-thymeleaf-分页
1.HTML代码
<div th:fragment="paginater"> <ul th: th:if="${null!=page}" class="pagination pagination-sm pull-right" > <li><a href="javascript:void(0);" th:onclick="|paginater(${page.pageNum},${page.pageSize},${id},${url})|"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></a></li> <li th:class="${page.isFirstPage}?'disabled':''" th:onclick="|paginater(1,${page.pageSize},${id},${url})|"><a href="javascript:void(0);" >首页</a></li> <li th:class="${page.hasPreviousPage}?'':'disabled'"><a href="javascript:void(0);" th:onclick="|paginater(${page.pageNum}-1,${page.pageSize},${id},${url})|">上一页</a></li> <li th:class="${i==page.pageNum?'active':''}" th:each="i:${#numbers.sequence(1,page.pages)}"> <a th:if="${page.pageNum-2<i&&i<page.pageNum+6&&i!=page.pageNum}" th:text="${i}" href="javascript:void(0);" th:onclick="|paginater(${i},${page.pageSize},${id},${url})|"></a> <a th:if="${i}==${page.pageNum}" href="" th:text="${i}"></a> <a th:if="${i}==${page.pageNum}+6" >...</a> <a th:if="${i==page.pages&&i!=page.pageNum&&page.pages>page.pageNum+6}" th:text="${i}" href="javascript:void(0);" th:onclick="|paginater(${i},${page.pageSize},${id},${url})|"></a> </li> <li th:class="${page.hasNextPage}?'':'disabled'"><a href="javascript:void(0);" th:onclick="|paginater(${page.pageNum}+1,${page.pageSize},${id},${url})|">下一页</a></li> <li th:class="${page.isLastPage}?'disabled':''"><a href="javascript:void(0);" th:onclick="|paginater(${page.pages},${page.pageSize},${id},${url})|">尾页</a></li> <li class="disabled"><a th:text="${'共'+page.total+'条数据'}"></a></li> <li class="disabled"><a th:text="${'共'+page.pages+'页'}"></a></li> <li class="disabled"><a >转到</a> </li> <li><a ><input type="text" min="1" max="{$pagecount}" name="pageindex" placeholder="页码"/></a></li> <li><a href="javascript:void(0);" th:onclick="|paginater('paginater_YM_ID',${page.pageSize},${id},${url})|"><span class="glyphicon glyphicon-arrow-right" aria-hidden="true"></span></a></li> </ul> </div>
2.JS代码
function paginater(pageNum,pageSize,id) { var form ; if(null==id||''==id){ form = $("form").first(); }else{ form = $("#"+id); } if("paginater_YM_ID"==pageNum){ pageNum = $("#paginater_YM_ID").val(); } form.append("<input type='text' value='"+pageNum+"' name='pageNum' />"); form.append("<input type='text' value='"+pageSize+"' name='pageSize' />"); form.submit(); }
3.引用
<div th:insert="/common/common::paginater"/>