how to create pagination links from json data in laravel blade

Question

i am trying to create pagination links from json response in laravel blade template. i know it simply can create using php, but how can i do this from a json response.

here is my controller method :

function getContact()
{   
     return $contacts = Contact::where(array('is_active'=>1))
                        ->paginate(2);
}

and here is my jquery ajax code to show data on table...

   $.ajax({
            type:'GET',
            url: '<?php echo URL::to('contactgroup/contact') ?>', 

            dataType: 'json',               
            success: function(data){
                //console.log(data['data'].length);
            var table='<thead><th><input type="checkbox" id="checkAll" name="checkAll[]"/></th><th>Name</th><th>contact No</th></thead>';
            for(var i=0; i<data['data'].length; i++){
                table += '<tr><td><input type="checkbox" name="checkbox[]" class="individualCheckbox" value="'+data['data'][i].id+'"/></td><td>'+data['data'][i].contact_name+'</td><td>'+data['data'][i].primary_contact_no+'</td></tr>';

            }
            $('#contactTable').empty();
            $('#contactTable').append(table);
           }
       });

and the json response in console.log is-

{"total":3,"per_page":2,"current_page":1,"last_page":2,"next_page_url":"http:\/\/localhost\/smsapi\/public\/contactgroup\/contact\/?page=2","prev_page_url":null,"from":1,"to":2,"data":[{"id":1,"contact_name"
:"M Islam","primary_contact_no":"017********","personal_email":"[email protected]","work_email"
:"[email protected]","personal_phone":"017********","work_phone":"017********","personal_address":"abc","work_address":"ring road","is_active":1,"entry_by":7},{"id":4,"contact_name":"sdsdf","primary_contact_no":"242342","personal_email":"[email protected]","work_email":"[email protected]","personal_phone":"12142","work_phone":"fgbf","personal_address":"gfg","work_address":"fgfg"
,"is_active":1,"entry_by":7}]}

i can show the data into a table using above jquery code but how can i show the pagination from "total":3,"per_page":2,"current_page":1,"last_page":2,"next_page_url":"http:\/\/localhost\/smsapi\/public\/contactgroup\/contact\/?page=2","prev_page_url":null,"from":1,"to":2,

using jquery.

Answer 1

In your controller

function getContact()
{   
   $contacts = Contact::where(array('is_active'=>1))
                    ->paginate(2);

   //return multiple value in JSON format
   return \Response::JSON(array(
                                   'data'       => $contacts, 
                                   'pagination' => (string) $contacts->links()
                                )
                          );
}

In your view

 $.ajax({
        type:'GET',
        url: '<?php echo URL::to('contactgroup/contact') ?>', 

        dataType: 'json',               
        success: function(data){
            //console.log(data['data'].length);
        var table='<thead><th><input type="checkbox" id="checkAll" name="checkAll[]"/></th><th>Name</th><th>contact No</th></thead>';
        for(var i=0; i<data['data'].length; i++){
            table += '<tr><td><input type="checkbox" name="checkbox[]" class="individualCheckbox" value="'+data['data'][i].id+'"/></td><td>'+data['data'][i].contact_name+'</td><td>'+data['data'][i].primary_contact_no+'</td></tr>';

        }
        $('#contactTable').empty();
        $('#contactTable').append(table);
        $('#pagination').html(data['pagination']);   //add this element in your HTML as well
       }
   });