如何使用jquery在工作条件下使用laravel显示json分页响应?

时间:2017-06-10 11:00:43

标签: php json laravel api pagination

这是我的json回复:

{
  "data": {
    "current_page": 1,
    "data": [
      {
        "course_id": 1,
        "course_name": "Certificate in Makeup Artistry Using M.A.C Makeup",
        "city": "Manchester",
        "course_date": "2017-01-11",
        "course_session": "Morning(9:00AM-12:00PM)",
        "loc_lat": 32.4525,
        "loc_lang": -65.1425,
        "seats": 28
      }
    ],
    "from": 1,
    "last_page": 3,
    "next_page_url": "http://localhost/lmsapi/public/api/v1/raw?page=2",
    "path": "http://localhost/lmsapi/public/api/v1/raw",
    "per_page": 1,
    "prev_page_url": null,
    "to": 1,
    "total": 3
  },
  "pagination": {
    "total_count": 3,
    "total_pages": 3,
    "current_page": 1,
    "limit": 1
  }
}

这是我的控制器代码:

public function index2()
{
    $courseList2 = CoursesReport::paginate(1);

    return Response::json([
        'data' => $courseList2->toArray(),
        'pagination'=>[
        'total_count'=>$courseList2->total(),
        'total_pages' => ceil($courseList2->total()/$courseList2-perPage()),
        'current_page'=>$courseList2->currentPage(),
        'limit' => $courseList2->perPage()
    ],200); 
}

这是我的jquery代码:

$(document).ready(function(){
    var data = {};
    ind = 1;
    var apiUrl =  window.location.protocol+'//';
    apiUrl += window.location.host+'/lmsapi/public/api/v1/';

    var request = $.ajax({
        url: apiUrl + 'raw',
        data:data,
        type: 'GET',
        dataType:'json' 
    });

    request.done(function(data) {
        var html = '';
        var courses = data.data;
        var pagi = data.pagination; // this is wrong i think. :(
        if (data.data.length > 0 ) {
            for (var i = 0; i < courses.length; i++) {
                var course = courses[i];
                html += '<tr>\
                <td>'+ ind++ +'</td>\
                <td>'+course.course_name+'</td>\
                <td>'+course.location+'</td>\
                <td>'+course.city+'</td>\
                <td><a class="btn btn-xs btn-warning" href="#">Edit</a>&nbsp;<a 
 class="btn btn-xs btn-danger"href="#">Delete</a>&nbsp;<a class="btn btn-xs 
 btn-success" href="#">View</a></td>\
                </tr>';
                $('#course-list').html(html);   
        }
    } else {
        html  += '<tr><td colspan="7">\
        <h1>Nothing Here Yet.</h1>\
        <p>We could\'nt find any record related to the defined criteria. Please 
try again later.</p></div></td></tr>';
}
       $('#pag1').append(pagi);
   });
});

基本上,我想在我的html页面上通过web api显示数据。 我需要帮助来解析分页JSON响应并希望填充html。

0 个答案:

没有答案