Question

所有

我正在使用Jquery数据表。我使用以下示例：

我想知道是否有办法在底部而不是顶部显示“Show 10 Entries”。它应该显示在表格底部的“显示51个条目中的1到10个”之前。

我该怎么做？

由于

Answer 1

这样做的方法是更改.js中的sDom，您可以在其中定义表：

$('#TABLE_ID').dataTable({`
    "sDom": 'Rfrtlip'`    
 });

此外，您应该将.css更改为显示在＆＃34;显示...条目＆＃34;旁边，因为它会显示在它上方。

这是sDom选项的解释：

允许以下选项：

＆＃39;升＆＃39; - 长度变化
＆＃39; F＆＃39; - 过滤输入
＆＃39;吨＆＃39; - 桌子！
＆＃39;我＆＃39; - 信息
＆＃39; P＆＃39; - 分页
＆＃39; R＆＃39; - pRocessing

允许使用以下常量：

＆＃39; H＆＃39; - jQueryUI主题＆＃34;标题＆＃34;类（＆＃39; fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix＆＃39;）
＆＃39; F＆＃39; - jQueryUI主题＆＃34;页脚＆＃34;类（＆＃39; fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix＆＃39;）

需要以下语法：

＆＃39;＆LT;＆＃39;和＆＃39;＆gt;＆＃39; - div元素
＆＃39;＆LT;＆＃34;类＆＃34;和＆＃39;＆gt;＆＃39; - div与班级
＆＃39;＆LT;＆＃34;＃标识＆＃34;和＆＃39;＆gt;＆＃39; - 带ID的div示例：
＆＃39;＆LT;＆＃34;包装＆＃34;＆flipt GT;＆＃39; ＆＃39;＆IP GT;＆＃39;

PS：这也可以帮到你：

datatables sDom

add-datatables-length-at-the-bottom-of-the-table

Answer 2

有一个类似的问题（想要删除一些不必要的控件），处理它的唯一方法似乎是自己修改表。我使用了fnDrawCallback回调（http://datatables.net/usage/callbacks）。

在你的情况下会是这样的

$('#tableId').dataTable({
    "fnDrawCallback": function () {
        $('#tableId_info').prepend($('#tableId_length'));
    }
});

只需检查该演示中生成的代码，它非常简单（除了它没有格式或缩进）。

如果您不害怕影响页面上的其他表格，也可以使用类名而不是ID。它们的格式为dataTables_length。

使用css进行其他样式设计。

Answer 3

这是一个例子。本文档有很多帮助：https://datatables.net/release-datatables/examples/basic_init/dom.html

我的数据表如下所示：

我还必须添加css这一行：

.dataTables_length {
    margin-top: 10px;
    margin-left: 20px;
}

代码是：

  $('.data_table').DataTable({
            "iDisplayLength": 20,
            "aLengthMenu": [[10, 20, 50, -1], [10, 20, 50, "All"]],
            "pagingType": "simple_numbers",
            "language": {
                searchPlaceholder: "Search",
                search: "",

            },
            "dom": '<"top"f>rt<"bottom"ilp><"clear">'
        });

在表格底部显示页面长度

3 个答案: