Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

datatable pagination in laravel

I am using laravel 5.0 I am also using datatable jquery plugin to display grid.

Controller mehtod

 public function index() {

    $jobs = \App\Job::orderBy('created_at', 'DESC')->limit(1000)->get();

    return View::make('jobs.index', ['jobs' => $jobs]);
}

The issue: Right now I hard-coded the ->limit(1000) to 1000 jobs in datatable grid to display it but i have more then 1000 records to display.

What I want? I want to display 500 records with grid and then 500 records. I am not sure if there is any call back data-table plugin function available? I need a dynamic way to load next 500

NOTE: I am not willing to us this solution of scrolling https://datatables.net/extensions/scroller/examples/initialisation/server-side_processing.html

like image 365
Peter Avatar asked Dec 06 '22 14:12

Peter


1 Answers

You can user ajax data source:

please visit : https://datatables.net/examples/ajax/objects.html

Example PHP Script:

// function will process the ajax request
public function getMembers(Request $request) {

        $draw = $request->get('draw');
        $start = $request->get('start');
        $length = $request->get('length');


        $search = (isset($filter['value']))? $filter['value'] : false;

        $total_members = 1000; // get your total no of data;
        $members = $this->methodToGetMembers($start, $length); //supply start and length of the table data

        $data = array(
            'draw' => $draw,
            'recordsTotal' => $total_members,
            'recordsFiltered' => $total_members,
            'data' => $members,
        );

        echo json_encode($data);
    }

Example JavaScript :

$('#all-member-table').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": {
            url: base_url+"ajax/members"
            },
            "columns": [
            { data: '1' },
            { data: '2' },
            { data: '3' },
            { data: '4' },
            { data: '5' },
        ]
    } );

Example HTML:

<table id="all-member-table">
            <thead>
                <tr>
                    <th>Column1</th>
                    <th>Column2</th>
                    <th>Column3</th>
                    <th>Column4</th>
                    <th>Column5</th>
                </tr>
            </thead>
  </table> 
like image 91
Hasan Tareque Avatar answered Dec 08 '22 03:12

Hasan Tareque