【问题标题】:Pagination for jQuery DatatablejQuery 数据表的分页
【发布时间】:2016-08-01 07:40:28
【问题描述】:

我使用 jQuery 创建了一个数据表。以下是相同的 HTML 代码:

<table id="md-transaction-table" class="wide100 margin-bottom-1">
     <thead>
        <tr>
           <th>Payment Date</th>
           <th>Description</th>
           <th>Statement Number</th>
           <th>Payment Transaction ID</th>
           <th>Amount</th>
           <th>Payment Method</th>
           <th>User</th>
           <th>Payment Status</th>   
        </tr>
     </thead>
     <tbody>
    </tbody>
</table>

下面是相同的 jQuery 代码:

$('#md-transaction-table').dataTable({
    "data":json,
    "dom": 't',
    "bSort":false,
    "pageLength": 8,
    "paging": true,
    "bPaginate":true,
    "pagingType":"full_numbers",
    "columns": [
        {"data": "paymentDate"},
        {"data": "description"},
        {"data": "statementNumber"},
        {"data": "transactionId"},
        {"data": "amount"},
        {"data": "paymentMethod"},
        {"data": "user"},
        {"data": "paymentStatus"}

    ],
    "columnDefs": [
        {className: "pad-md-left-p-10 pad-top-bottom-p-10", "targets": [0,1,2,3,4,5,6,7]}
        ]

}); // End of datatable function 

现在我需要在表格下方放置一个分页。像这样的:

我的要求是,最初我只需要在表格中显示 8 行。当用户单击下一个按钮时,它必须隐藏前 8 行并显示后 8 行。你能告诉我我们该怎么做吗?我正在使用数据表的默认分页功能。但是分页没有出现。你能告诉我哪里做错了吗?

【问题讨论】:

  • 您是否尝试过数据表的默认分页功能? example
  • @Buksy:我试过了。请参阅编辑后的代码。但是没有显示分页。
  • 你需要给dom添加分页。

标签: javascript jquery pagination datatables


【解决方案1】:

从数据表初始化中删除dom 选项,分页将起作用。

jsFiddle

【讨论】:

    猜你喜欢
    • 2011-04-04
    • 1970-01-01
    • 1970-01-01
    • 2014-06-27
    • 2017-08-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-06-28
    相关资源
    最近更新 更多