6

全部，

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

带分页的数据表

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

我怎样才能做到这一点？

谢谢

4

3 回答 3

15

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

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

此外，您应该将 .css 更改为显示在“正在显示...条目”旁边，因为这样它就会出现在它的上方。

这是 sDom 选项的解释：

允许以下选项：

  • 'l' - 长度变化
  • 'f' - 过滤输入
  • 't' - 桌子！
  • '我' - 信息
  • 'p' - 分页
  • 'r' - 处理

允许使用以下常量：

  • 'H' - jQueryUI 主题“标题”类（'fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix'）
  • 'F' - jQueryUI 主题“页脚”类（'fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix'）

预期使用以下语法：

  • '<' 和 '>' - div 元素
  • '<"class" 和 '>' - 带有类的 div
  • '<"#id" 和 '>' - 带有 ID 的 div 示例：
  • '<"wrapper"翻转>' 'ip>'

PS：这也可以帮助你：

数据表 sDom

在表底部添加数据表长度

于 2014-10-13T12:46:48.190 回答
4

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

在你的情况下会是这样的

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

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

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

使用 css 进行附加样式。

于 2010-06-27T18:56:07.180 回答
2

这是一个例子。本文档有很大帮助：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">'
        });
于 2016-05-06T07:33:08.673 回答