Question

我希望我的数据表每页显示50行。

我尝试设置它：bLengthChange：true和pageLength：50但它不起作用。

在一个理想的世界里，我也会摆脱bLengthChange - ＆gt;是的，所以我没有看到组合选择我想要多少行......

这是我的代码。

<html><body>
 <head>
     <link rel="stylesheet" href="//cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css">
</head>
<body>
<table class="table responsive table-togglable table-hover">
    <thead>
    <tr>
        <th data-toggle="true">ID</th>
        <th >Usuario</th>
        <th >Objeto</th>
        <th >Id del Objeto</th>
        <th class="none">Antes</th>
        <th class="none">Despues</th>
        <th >type</th>
        <th >Creaci&oacute;n</th>
        <th >Actualizaci&oacute;n</th>
    </tr>
    </thead>
    <tbody>
     <tr>
        <td>2165</td>
        <td> - </td>
        <td>PersonReferences</td>
        <td>3802973</td>
        <td> -  </td>
        <td> Large Text </td>
        <td>created</td>
        <td>2016-05-11 17:07:23</td>
        <td>2016-05-11 17:07:23</td>
        </tr>
  </tbody>
</table>

<script src="http://rh.dev/assets/materialize/js/jquery-1.11.2.min.js"></script>
<script src="http://rh.dev/assets/js/datatables/datatables.min.js"></script>
<script src="http://rh.dev/assets/js/datatables/extensions/responsive.min.js"></script>

    <script>
    $('.table-togglable').DataTable({
        bLengthChange: true,
        pageLength: 50,
        bInfo: false,
        responsive: true,
        "bAutoWidth": false,
    });
</script>

任何想法？

Answer 1

您可以将iDisplayLength用于 DataTables 1.10 + ：

使用分页时在单个页面上显示的行数。如果功能启用（bLengthChange）然后最终用户将能够使用弹出菜单将其覆盖为自定义设置。

$(".table-togglable").DataTable({
    bLengthChange: true,
    "lengthMenu": [ [10, 15, 25, 50, 100, -1], [10, 15, 25, 50, 100, "All"] ],
    "iDisplayLength": 50,
    bInfo: false,
    responsive: true,
    "bAutoWidth": false
});

结果：https://jsfiddle.net/cmedina/7kfmyw6x/50/

50个问题时，数据表只显示10行

1 个答案: