如何向现有代码添加分页？

Posted 2023-05-09

【中文标题】如何向现有代码添加分页？

【英文标题】：How can I add pagination to my existing code?

【发布时间】：2019-06-03 18:48:08

【问题描述】：

我想将分页添加到我使用 ajax 编程的现有表格中。

我尝试了多种分页解决方案，但没有一个看起来与我现在拥有的现有表格兼容

index.php 中的表格

<div class="table-responsive">
  <table class="table table-bordered table-striped">
    <thead>
    <th ></th>
    <th >Serial No.</th>
    <th >Equipment Type</th>
    <th >Document Remarks</th>
    <th >Supplier</th>
    <th >Date In</th>
    <th >Customer</th>
    <th >Date Out</th>
    </thead>
    <tbody></tbody>
 </table>
</div>

在 index.php 中显示表格的脚本

<script>
    $(document).ready(function () 

        function fetch_data()
        
            $.ajax(
                url: "select.php",
                method: "POST",
                dataType: "json",
                success: function (data)
                
                    var html = '';
                    for (var count = 0; count < data.length; count++)
                    
                        html += '<tr>';
                        html += '<td><input type="checkbox" value="' + 
data[count].id + '" id="' + data[count].id + '" data-serial_number="' + 
data[count].serial_number + '" data-equipment_type="' + 
data[count].equipment_type + '" data-document_remarks="' + 
data[count].document_remarks + '" data-supplier="' + data[count].supplier + 
'" data-date_scan="' + data[count].date_scan + '" data-customer="' + 
data[count].customer + '" data-date_out="' + data[count].date_out + '" 
class="check_box"  /></td>';
                        html += '<td>' + data[count].serial_number + '</td>';
                        html += '<td>' + data[count].equipment_type + '</td>';
                        html += '<td>' + data[count].document_remarks + '</td>';
                        html += '<td>' + data[count].supplier + '</td>';
                        html += '<td>' + data[count].date_scan + '</td>';
                        html += '<td>' + data[count].customer + '</td>';
                        html += '<td>' + data[count].date_out + '</td></tr>';
                    
                $('tbody').html(html);
            
        );
    

    fetch_data();
 
</script>

选择.php

include('database_connection.php');

$query = "SELECT * FROM inventory ORDER BY id DESC";

$statement = $connect->prepare($query);

if ($statement->execute()) 
    while ($row = $statement->fetch(PDO::FETCH_ASSOC)) 
        $data[] = $row;
    

    echo json_encode($data);

?>

【问题讨论】：

你说的“它们都不像我现有的表兼容”是什么意思？

@GregSchmidt 对我来说，作为一名学生，我不太清楚如何将分页解决方案应用于我现有的表格。

【参考方案1】：

在您的 fetch_data() 函数中，您需要在 POST 请求中包含页面数据：

limit 应该是每页可查看的项目数 offset 应该是 limit 乘以页码（从 0 开始）

例如。下面将请求结果的第二页（每页 10 个结果）

$.ajax(
  url: "select.php",
  method: "POST",
  dataType: "json",
  data: limit: 10, offset: 10,
  // etc.

在您的 PHP 脚本中，您需要读取这些变量并将它们添加到您的查询中：

$limit = $_POST['limit'];
$offset= $_POST['offset'];

$query = "SELECT * FROM inventory ORDER BY id DESC LIMIT = ? OFFSET= ?";
$statement = $connect->prepare($query);

if ($statement->execute([$limit, $offset])) 
    while ($row = $statement->fetch(PDO::FETCH_ASSOC)) 
        $data[] = $row;
    

    echo json_encode($data);

【讨论】：

嗨！谢谢回复！我试过了，我的表中没有显示我的 sql 数据:(，我是否将选择查询中的问号保留原样？

@QairulShazriz 是的，问号是prepared statements 的一部分。您要显示的库存表中的行数是否超过 10 行？

是的，数据库目前有超过 300 多个数据，并且会不断增加。那么我该怎么做呢？我非常感谢它帮助我

对您的数据库运行此查询是否返回结果：SELECT * FROM inventory ORDER BY id DESC LIMIT = 10 OFFSET= 10

遗憾的是没有一个结果。