php - 使用 jquery tablesorter 时如何创建动态表页？

Question

我有下表代码：

<table id="table_results" class="tablesorter">
    <thead>
    <tr>
        <th>Restaurant</th>
        <th>Region</th>
        <th>Settlement</th>
        <th>Kashrut</th>
        <th>Num of Seats</th>
    </tr>
    </thead>

    <tbody>
    <?php
    foreach ($restaurants as $key => $restaurant) {
        $region = get_region_by_id("restaurants", $restaurant['area']);
        echo '<tr><td>' . $restaurant['name'] . '</td><td>'
            . $region['name'] . '</td><td>' . $restaurant['city']
            . '</td><td>' . $restaurant['kosher'] . '</td><td>'
            . $restaurant['places_summer'] . '</td></tr>';
    }
    ?>
    </tbody>
    <tfoot>
    </tfoot>
</table>

这是 jquery javascript 代码：

$(document).ready(function() { 
    $("#table_results").tablesorter(); 
}); 

当$resturants超过 15 行时，我想为表格创建动态页面（让我们在表格页脚中说） 。每页应该有 15 个结果。我考虑过使用 jquery 选项卡，但是它不适用于 tablesorter，因为每个选项卡只能保存 15 个结果，并且排序仅适用于它们，并且我希望排序适用于所有表。

任何人都知道在保留 tablesorter 功能的同时做到这一点的好方法吗？

编辑 - 输出表的示例：

<table id="table_results" class="table_results tablesorter tablesorter-default">
    <thead>
    <tr class="tablesorter-headerRow">
        <th data-column="0" class="tablesorter-header" tabindex="0"
            unselectable="on" style="-webkit-user-select: none;">
            <div class="tablesorter-header-inner">Restaurant</div>
        </th>
        <th data-column="1" class="tablesorter-header" tabindex="0"
            unselectable="on" style="-webkit-user-select: none;">
            <div class="tablesorter-header-inner">Region</div>
        </th>
        <th data-column="2" class="tablesorter-header" tabindex="0"
            unselectable="on" style="-webkit-user-select: none;">
            <div class="tablesorter-header-inner">Settlement</div>
        </th>
        <th data-column="3" class="tablesorter-header" tabindex="0"
            unselectable="on" style="-webkit-user-select: none;">
            <div class="tablesorter-header-inner">Kashrut</div>
        </th>
        <th data-column="4" class="tablesorter-header" tabindex="0"
            unselectable="on" style="-webkit-user-select: none;">
            <div class="tablesorter-header-inner">Num of Seats</div>
        </th>
    </tr>
    </thead>

    <tbody>
    <tr>
        <td>BP</td>
        <td>Haifa &amp; Area</td>
        <td>Haifa</td>
        <td>Kosher</td>
        <td>250</td>
    </tr>
    <tr>
        <td>Cafe Horesh Carmel</td>
        <td>Haifa &amp; Area</td>
        <td>Haifa</td>
        <td>Kosher</td>
        <td>120</td>
    </tr>
    <tr>
        <td>Ein Hamifratz</td>
        <td>Haifa &amp; Area</td>
        <td>Kibbutz Ein Hamifratz</td>
        <td>Kosher</td>
        <td>500</td>
    </tr>
    <tr>
        <td>Guest House Haifa</td>
        <td>Haifa &amp; Area</td>
        <td>Haifa</td>
        <td>Kosher</td>
        <td>150</td>
    </tr>
    </tbody>
    <tfoot>
    </tfoot>
</table>