Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery datatable server-side pagination not working

I'm trying to implement the jquery datatables on a php project using the server-side processing, but the pagination is not working and I have no errors in the firebug console.

The page is simple and straight forward, here is the html code:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-2.2.3/dt-1.10.12/datatables.min.css"/>
  <script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-2.2.3/dt-1.10.12/datatables.min.js"></script>

</head>

<body>
<table class="table">
  <thead>
  <tr>
    <th col-data="item_id">Item Id</th>
    <th col-data="name">Name</th>
  </tr>
  </thead>
</table>

<script type="text/javascript">

  $(document).ready(function() {
    var dataTable = $('.table').DataTable( {
      "processing": true,
      "serverSide": true,
      "buttons": [],
      "order": [],
      "ajax":{
        url :"{{ url('stock_acc_get') }}", // json datasource
        type: "post",
      }
    } );

  } );
</script>

</body>

</html>

Here is the data posted on server(viewed in firebug console):

columns[0][data]        0
columns[0][name]    
columns[0][orderable]       true
columns[0][search][regex]   false
columns[0][search][value]   
columns[0][searchable]      true
columns[1][data]        1
columns[1][name]    
columns[1][orderable]       true
columns[1][search][regex]   false
columns[1][search][value]   
columns[1][searchable]      true
draw    1
length  10
search[regex]   false
search[value]   
start   0

And here is the json response from the server:

{
  "draw":1,
  "recordsTotal":23,
  "recordsFiltered":10,
  "data": [
    ["100018","Test Acc"],["100019","Test Acc 2"],
    ["100020","Test Acc 3"],["5845645","Optional 1"],
    ["56456456","Optional 2"],["541515","Optional 3"],
    ["845812","Optional 4"],["103646","Belte Setesdal"],
    ["103647","Belte Setesdal"],["103681","Belte Sigdal-Eggedal"]
  ]
}

The page is set to display 10 records. The total number of records is 23 and it doesn't create the links to navigate to the next pages. I've attached a photo for better understand, the Next/Previous buttons are disabled and it shows me that is only one page.

enter image description here

like image 208
Ceparu Stefan Avatar asked Jul 05 '16 21:07

Ceparu Stefan


1 Answers

recordsFiltered is supposed to represent the number of records that pass the search box (along with any other) filters, not the number of records on the page.

You are telling DataTables that there are only 10 relevant records, so it doesn't attempt to set up the paging for the other 13.

See the third DataTables FAQ post (in the server-side processing category), or the Server-side processing page linked in that post for more information.

like image 160
Chris H. Avatar answered Nov 08 '22 09:11

Chris H.