thinkphp5 ajax無重新整理分頁

thinkphp5 ajax 無重新整理分頁效果的實作

1.在做paginate分頁的時候，修改a連結

$res = db("xxx")->where("1=1")->paginate(1,false,['path'=>'javascript:AjaxPage([PAGE]);']);
           

2.js寫ajaxPage方法去調用ajax

//無重新整理分頁
            function AjaxPage(page){
                $.get(
                    '/index.php/admin/Student/getPage',
					{ page:page },
		function (data) {
                        var html = "";
                        $(data.data.data).each(function (i,d) {

                             html += "<tr>\n" +
                                 "<th>資助人</th>\n" +
                                 "<th>學生姓名</th>\n" +
                                 "<th>性别</th>\n" +
                                 "<th>出生日期</th>\n" +
                                 "<th>家庭人數</th>\n" +
                                 "<th>家庭年收入</th>\n" +
                                 "<th>望助金額（學期）</th>\n" +
                                 "<th>操作</th>\n" +
                                 "</tr>";
                             html += "<tr>\n" +
                                 "<td>"+ d.u_id +"</td>\n" +
                                 "<td>"+ d.name +"</td>\n" +
                                 "<td>"+ d.sex +"</td>\n" +
                                 "<td>"+ d.birthday.substring(0,10)+"</td>\n" +
                                 "<td>"+ d.family_num +"</td>\n" +
                                 "<td>"+ d.family_income +"</td>\n" +
                                 "<td>" + d.money + "</td>\n" +
                                 "<td>\n" +
                                 "<div class=\"button-group\">\n" +
                                 "<a class=\"button border-main\" href=\"javascript:vaid(0);\" οnclick=\"Delivery_stop(this,"+ d.id +")\"><span class=\"icon-plus\"></span> 上傳彙款記錄</a>\n" +
                                 "<a class=\"button border-green\" href=\"/index.php/admin/Student/student_eye/id/"+ d.id +"\"><span class=\"icon-eye\"></span> 檢視</a>\n" +
                                 "<a class=\"button border-main\" href=\"/index.php/admin/Student/student_list_add/id/"+ d.id +"\"><span class=\"icon-edit\"></span> 編輯</a>\n" +
                                 "<a class=\"button border-red\" href=\"/index.php/admin/Student/student_del/id/"+ d.id +"\" οnclick=\"return del()\"><span class=\"icon-trash-o\"></span> 删除</a>\n" +
                                 "</div>\n" +
                                 "</td>\n" +
                                 "</tr>";
                        });
                        html +=  "<tr>\n" +
                            "<td colspan=\"10\"><div class=\"pagelist\"> "+ data.ajaxPage +" </div></td>\n" +
                            "</tr>";
                    $('.ajaxPage').html(html);
                })
            }
           

3.ajax通路的控制器代碼

/**
     * ajax 無重新整理分頁
     * @return mixed
     * @throws \think\exception\DbException
     */
    public function getPage()
    {
        if(input("page")){
            $data['data'] = db("xxx")->where("1=1")->paginate(1,false,['page'=>input("page"),'path'=>'javascript:AjaxPage([PAGE]);']);
            $data['ajaxPage'] =  $data['data']->render();
            return $data;
        }

    }