SSM+Maven——分页功能添加

1.Spring-dao.xml中配置分页插件

<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="dataSource" ref="dataSource"/>
        <property name="mapperLocations" value="classpath:com/itany/zshop/mapper/*.xml"/>
        <property name="typeAliasesPackage" value="com.itany.zshop.pojo"/>
        <!-- 分页插件pagehelper -->
        <property name="plugins">
            <list>
                <bean class="com.github.pagehelper.PageInterceptor">
                    <property name="properties">
                        <props>
                            <prop key="helperDialect">mysql</prop>
                        </props>
                    </property>
                </bean>
            </list>
        </property>
    </bean>

2.Controller设置

 @RequestMapping("/findAll")
    public String findAll(Integer pageNum,Model model){
        if(ObjectUtils.isEmpty(pageNum)){       //页码数据为空，就将其设置为1
            pageNum= PaginationConstant.PAGE_NUM;
        }

        //设置分页
        PageHelper.startPage(pageNum,PaginationConstant.PAGE_SIZE);

        //查找数据
        List<ProductType> productTypes = productTypeService.findAll();

        //将查找出的结果封装到PageInfo对象中
        PageInfo<ProductType> pageInfo=new PageInfo<>(productTypes);
        //pageInfo.getPageNum();
        //pageInfo.getPages();
        //pageInfo.getNextPage();
        //pageInfo.getPrePage();
        //pageInfo.getList();

        model.addAttribute("pageInfo",pageInfo);

        return "productTypeManager";
    }

3.前端页面中利用bootstrap进行分页效果

 <script src="${pageContext.request.contextPath}/js/bootstrap-paginator.js"></script>

<script>
        $(function(){
           $('#pagination').bootstrapPaginator({
               bootstrapMajorVersion:3,
               currentPage:${pageInfo.pageNum},
               totalPages:${pageInfo.pages},
               pageUrl:function(type,page, current){
                    return '${pageContext.request.contextPath}/backend/productType/findAll?pageNum='+page;
               },
               itemTexts: function (type, page, current) {
                   switch (type) {
                       case "first":
                           return "首页";
                       case "prev":
                           return "上一页";
                       case "next":
                           return "下一页";
                       case "last":
                           return "末页";
                       case "page":
                           return page;
                   }
               }
           });
        });
 </script>

效果如下：