Javascript jquery 数据表服务器端分页不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/38212906/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 21:11:44  来源:igfitidea点击:

jquery datatable server-side pagination not working

javascriptphpjquerypaginationdatatables

提问by Ceparu Stefan

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

我正在尝试使用服务器端处理在 php 项目上实现jquery数据表,但分页不起作用,我在萤火虫控制台中没有错误。

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

页面简单明了,这里是html代码:

<!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:

这是来自服务器的 json 响应:

{
  "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.

该页面设置为显示 10 条记录。记录总数为 23,它不会创建导航到下一页的链接。我附上了一张照片以便更好地理解,下一个/上一个按钮被禁用,它显示我只有一页。

enter image description here

在此处输入图片说明

回答by Chris H.

recordsFilteredis 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.

recordsFiltered应该表示通过搜索框(以及任何其他)过滤器的记录数,而不是页面上的记录数。

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.

您告诉 DataTables 只有 10 个相关记录,因此它不会尝试为其他 13 个设置分页。

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

请参阅第三篇 DataTables FAQ 帖子(在服务器端处理类别中),或该帖子中链接的服务器端处理页面以获取更多信息。

回答by Rashedul Islam Sagor

Mainly the recordsFilteredis working for create pagination. so pass the total number of data in your table on this parameter recordsFiltered

主要recordsFiltered是用于创建分页。因此,在此参数上传递表中的数据总数recordsFiltered

回答by FIROZUR

Example:A) total record 100 in user table B) search/default/ matched row 70 C) per page show limited row is 10; So, recordsTotal=> C recordsFiltered=B

示例:A) 用户表中的总记录 100 B) 搜索/默认/匹配行 70 C) 每页显示限制行为 10;所以,recordsTotal=> C recordsFiltered=B

Mainly the recordsFilteredis working for create pagination.

主要是记录过滤器用于创建分页。