ajax+pagehelper+mybatis+前段展示分页

maven

 <!-- pagehelper -->
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>1.3.2</version>
        </dependency>
        <dependency>
            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper-spring-boot-starter</artifactId>
            <version>1.2.10</version>
        </dependency>

xml

    <select id="findPageTags"  resultType="tag" >
        SELECT * FROM t_tag
    </select>

serviceImpl

  @Override
    public List<Tag> findPageTags() {
        return tagsMapper.findPageTags();
    }

controller

    //查找分页的方法
    @RequestMapping("/findPageTags")
    @ResponseBody
    public Object findPageTags(@RequestParam(value = "pageIndex",defaultValue = "1") Integer pageIndex, Model model) {
        PageHelper.startPage(pageIndex,8);
        List<Tag> tags = tagsService.findPageTags();
        PageInfo<Tag> pageInfo = new PageInfo<Tag>(tags);
        return pageInfo;
    }

前段展示

 <script>
                var index = 1;
                //网页加载完成默认加载第一页
                window.onload = function () {
                    first();
                };

                function first() {
                    $.ajax(
                        {
                            url: '/findPageTags',     // 请求地址, 就是你的控制器, 如 test.com/home/index/index
                            type: 'get',   // 请求方式
                            data: "pageIndex=" + index,
                            contentType: 'application/json',
                            success: function (result) {
                                if (result.isLastPage) {
                                    $("#next").hide();
                                } else {
                                    $("#next").show();
                                }
                                if (result.isFirstPage) {
                                    $("#back").hide();
                                } else {
                                    $("#back").show();
                                }
                                var html = "";
                                //alert(result.pageNum);
                                for (var i = 0; i < result.list.length; i++) {
                                    html += "<tr>"
                                    html += "<td>" + result.list[i].id + "</td>"
                                    html += "<td>" + result.list[i].name + "</td>"
                                    html += "<td><a οnclick='update(" + result.list[i].id + ",&quot;" + result.list[i].name + "&quot;)' ><i class='edit outline icon'></i></a>"
                                    html += "<a href='/deleteTagById?id=" + result.list[i].id + "'><i class='trash alternate outline icon'></i></a></td>"
                                    html += "</tr>"
                                }
                                $("#list").append(html);
                            },
                        })
                }

                function back() {
                    index -= 1;
                    $.ajax(
                        {
                            url: '/findPageTags',     // 请求地址, 就是你的控制器, 如 test.com/home/index/index
                            type: 'get',   // 请求方式
                            data: "pageIndex=" + index,
                            contentType: 'application/json',
                            success: function (result) {
                                if (result.isLastPage) {
                                    $("#next").hide();
                                } else {
                                    $("#next").show();
                                }
                                if (result.isFirstPage) {
                                    $("#back").hide();
                                } else {
                                    $("#back").show();
                                }
                                $("#list").empty();
                                var html = "";
                                //alert(result.pageNum);
                                for (var i = 0; i < result.list.length; i++) {
                                    html += "<tr>"
                                    html += "<td>" + result.list[i].id + "</td>"
                                    html += "<td>" + result.list[i].name + "</td>"
                                    html += "<td><a οnclick='update(" + result.list[i].id + ",&quot;" + result.list[i].name + "&quot;)' ><i class='edit outline icon'></i></a>"
                                    html += "<a href='/deleteTagById?id=" + result.list[i].id + "'><i class='trash alternate outline icon'></i></a></td>"
                                    html += "</tr>"
                                }
                                $("#list").append(html);
                            },
                        })
                }

                function next(result) {
                    index += 1;
                    $.ajax(
                        {
                            url: '/findPageTags',     // 请求地址, 就是你的控制器, 如 test.com/home/index/index
                            type: 'get',   // 请求方式
                            data: "pageIndex=" + index,
                            contentType: 'application/json',
                            success: function (result) {
                                if (result.isLastPage) {//判断需不需要显示上一页和下一页
                                    $("#next").hide();
                                } else {
                                    $("#next").show();
                                }
                                if (result.isFirstPage) {
                                    $("#back").hide();
                                } else {
                                    $("#back").show();
                                }
                                $("#list").empty();//清空上次显示的内容
                                var html = "";
                                //alert(result.pageNum);
                                for (var i = 0; i < result.list.length; i++) {
                                    html += "<tr>"
                                    html += "<td>" + result.list[i].id + "</td>"
                                    html += "<td>" + result.list[i].name + "</td>"
                                    html += "<td><a οnclick='update(" + result.list[i].id + ",&quot;" + result.list[i].name + "&quot;)' ><i class='edit outline icon'></i></a>"
                                    html += "<a href='/deleteTagById?id=" + result.list[i].id + "'><i class='trash alternate outline icon'></i></a></td>"
                                    html += "</tr>"
                                }
                                $("#list").append(html);
                            },
                        })
                }


            </script>