使用jQuery添加分页（保留发布数据）

Question

我正在寻找一种使用搜索表单设置分页的好方法，我希望它根据用户选择的每页条目数来显示数据。 他们在搜索结果下输入此值，并通过$ _POST ['searchamount']抓取。 然后，我尝试按照一些教程设置简单的分页，但是由于以下页面无法显示任何数据，我一直困扰于问题，我相信这是因为我的搜索脚本需要使用$ _POST ['search']值来为true表示某位预算提交表单，当单击数字滚动结果页面时，例如，它将仅重定向到search.php？page = 1。 如何添加其他方式，使其能够继续搜索，同时确保其安全性？

我在网上阅读时，有一些很酷的方法可以使用jQuery，但我更喜欢这样，它可以自动显示以下结果而无需离开页面。

这是我尝试过的一个例子

<?php while($row = mysqli_fetch_array($result)): ?>
    <tr>
        <td><?php echo $row['FactionName'];?></td>
        <td><?php echo $row['MoneyBalanceFormatted'];?></td>
        <td><?php echo $row['SpawnerWorthFormatted'];?></td>
        <td><?php echo $row['BlockWorthFormatted'];?></td>
        <td><?php echo $row['ItemWorthFormatted'];?></td>
        <td><?php echo $row['TotalWorthFormatted'];?></td>
        <td><?php echo $row['RichestMember'];?></td>
    </tr>
<?php endwhile;?>
<?php
    $page_query = "SELECT * FROM  ORDER BY TotalWorth DESC";
    $page_result = mysqli_query($con, $page_query);
    $total_records = mysqli_num_rows($page_result);
    $total_pages = ceil($total_records/$record_per_page);
    $start_loop = $page;
    $difference = $total_pages - $page;
    if($difference <= 5)
    {
     $start_loop = $total_pages - 5;
    }
    $end_loop = $start_loop + 4;
    if($page > 1)
    {
     echo "<a href='search.php?page=1'>First</a>";
     echo "<a href='search.php?page=".($page - 1)."'><<</a>";
    }
    for($i=$start_loop; $i<=$end_loop; $i++)
    {     
     echo "<a href='search.php?page=".$i."'>".$i."</a>";
    }
    if($page <= $end_loop)
    {
     echo "<a href='search.php?page=".($page + 1)."'>>></a>";
     echo "<a href='search.php?page=".$total_pages."'>Last</a>";
    }


    ?>

尽管我的示例根本无法正常工作，但它甚至显示了错误，mysqli_num_rows返回了布尔错误。

Answer 1

您可能对datatables感兴趣，这是一个用于表的jquery插件。 基本上，您必须删除代码段中的分页逻辑，以便仅保留表呈现位。 然后，借助datatables使用javascript在页面上启用分页和每页选择项。 查看他们的网站以获取指南和示例。

我的代码中经常有这种结构。 首先是一个循环，用来自SQL查询的数据填充表的页眉，页脚和正文。

    <?php if( isset($report['rows']) && count($report['rows']) > 0 ): ?>
        <div id="report-table-container">
            <table id="report-table" class="uk-table uk-table-hover uk-table-striped" cellspacing="0" width="100%">
                <thead>
                    <tr>
                    <?php foreach( $report['cols'] as $k => $v ): ?>
                        <th> <?= $v ?> </th> 
                    <?php endforeach ?>
                    </tr>
                </thead>
                <tfoot>
                    <tr>
                    <?php foreach( $report['cols'] as $k => $v ): ?>
                        <th> <?= $v ?> </th> 
                    <?php endforeach ?>
                    </tr>
                </tfoot> 
                <tbody>
                    <?php foreach($report['rows'] as $index => $entry): ?>
                    <tr>
                        <?php foreach( $report['cols'] as $k => $v ): ?>
                        <td> <?= $entry[$k] ?> </td> 
                        <?php endforeach ?>
                    </tr> 
                    <?php endforeach ?>
                </tbody>        
            </table>
        </div>  
        <?php endif ?>

请注意，该表具有属性id='report-table' 。 在您的JavaScript中使用此功能可在该表上启用分页。 像这样

<script>
$(document).ready(function() {
    $('#report-table').DataTable({
        dom: 'tipl'
    })
</script>

参数dom指定要添加到表中的元素。 例如， l指定一个下拉菜单，用于选择每页的项目数。 确保已导入jQuery和DataTable js和css文件。