datatable - DataTable：隐藏 Show Entries 下拉列表，但保留 Search 框

Question

是否可以隐藏“显示条目”下拉列表但将“搜索”框保留在 DataTable 中？我希望始终在底部显示 10 行分页以及搜索框，但不想显示显示条目下拉列表。

score 330 · Accepted Answer

您可以直接在此链接上找到更多信息：http: //datatables.net/examples/basic_init/filter_only.html

$(document).ready(function() {
$('#example').dataTable({
    "bPaginate": false,
    "bLengthChange": false,
    "bFilter": true,
    "bInfo": false,
    "bAutoWidth": false });
});

希望有帮助！

编辑：如果你是懒惰的，“bLengthChange”：假，是你需要改变的：）

score 78 · Accepted Answer

如果使用 Datatable > 1.1.0，那么lengthChange您需要的选项如下：

$('#example').dataTable( {
  "lengthChange": false
});

score 44 · Accepted Answer

"searching": false,   // Search Box will Be Disabled

"ordering": false,    // Ordering (Sorting on Each Column)will Be Disabled

"info": true,         // Will show "1 to n of n entries" Text at bottom

"lengthChange": false // Will Disabled Record number per page

score 22 · Accepted Answer

22

这是这篇文章的关键答案"bLengthChange": false,将隐藏条目下拉菜单

于 2015-02-10T14:48:37.780 回答

score 12 · Accepted Answer

我就是这样解决的。使用引导程序 4

    $(document).ready(function () {
        $('#table').DataTable({
            "searching": false,
            "paging": false,
            "info": false
        });
    });

cdn js：

cdn css：

score 10 · Accepted Answer

对于 DataTables <=1.9，@perpo的回答

$('#example').dataTable({
    "bLengthChange": false
});

工作正常，但对于 1.10+ 试试这个：

$('#example').dataTable({
    "dom": 'ftipr'
});

我们省略了l“长度更改输入控件”

1.9 文档

1.10 文档

score 10 · Accepted Answer

写吧：

  $(document).ready( function () {
        $('#example').dataTable( {
          "lengthChange": false
        } );
    } );

score 8 · Accepted Answer

sDom：“Tfrtip”或通过回调：

"fnHeaderCallback": function(){
    $('#YOURTABLENAME-table_length').hide();
}

score 6 · Accepted Answer

要禁用“显示条目”标签，请添加代码 dom: 'Bfrtip' 或者您可以添加 "bInfo": false

$('#example').DataTable({
    dom: 'Bfrtip'
})

score 3 · Accepted Answer

你也可以试试这个。

只需通过使用将其从 CSS 中隐藏，

 .dataTables_length {
        display: none;
    }

两者都会起作用。

score 1 · Accepted Answer

1

添加此选项：

"bInfo": false

于 2016-02-03T23:19:48.590 回答

score 1 · Accepted Answer

隐藏“显示条目”但仍有分页。我使用了下面的代码并且它有效。

"bPaginate": true,
"bLengthChange": false,
"bFilter": true,
"bInfo": false,
"bAutoWidth": false

score 0 · Accepted Answer

要禁用“显示条目”标签，请使用“bInfo”，例如：“bFilter”是搜索组件，但默认情况下处于活动状态。

$(document).ready( function () {
  $('#example').dataTable( {
    "bInfo": false
  } );
} );

启用或禁用表格信息显示。这会显示有关页面上当前可见数据的信息，包括有关过滤数据的信息（如果正在执行该操作）。

score 0 · Accepted Answer

如果你使用 Angular，你可以使用下面的代码来做同样的事情。

在 component.html 中

<table id="" datatable [dtOptions]="dtOptions" class="table dataTable">

并在您的 component.ts

 dtOptions: any = {}


 this.dtOptions = {
  searching: true,    //enables the search bar
  info: false        //disables the entry information
}

有更多可用的数据表选项，请访问此处了解更多信息

datatable - DataTable：隐藏 Show Entries 下拉列表，但保留 Search 框

14 回答 14

Related

Reference