我正在尝试在我的项目中实现FooTable-2
,但出于某种原因,我无法让分页工作。
我正在关注THIS教程,这就是我所拥有的表格代码:
<div id="mainContent">
<div id="allTrackersDiv" style="display: none;">
<label><b>Active Trackers</b></label>
<table class="activeTrackersTable" id="allTrackersTable"
data-page-navigation=".pagination">
<thead>
<tr>
<th> ID </th>
<th> col 1 </th>
<th> col 2 </th>
<th> col 3 </th>
</tr>
</thead>
<tbody data-bind="foreach: trackersObjArray">
<tr data-bind="click: test">
<td><span data-bind="text: tId"></span></td>
<td><span data-bind="text: tname"></span></td>
<td><span data-bind="text: pname"></span></td>
<td><span data-bind="text: tcreate"></span></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<div class="pagination"></div>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
问题是分页无法正常工作。我的表中有22条记录,它应该在第10条记录之后开始分页
以下是它的外观:
我在这里缺少什么?在我看来,一切看起来都很好。我错过了什么,我真的无法理解我的错误。
答案 0 :(得分:3)
您可以尝试提及
data-page-size="10"
明确。
如果这不起作用,可能是问题是由于动态数据被添加到footable。
使用
$('#myTable').append(html).trigger('footable_redraw');
这样可以重新绘制footable并应用大小限制。
参考链接:Footable data page size not respected和 Other issues due to dynamic data in footable