DataTable:隐藏"显示条目"下拉列表,但保留"搜索"框

Question

是否可以隐藏"显示条目"下拉列表,但将"搜索"框保留在DataTable中？我想在底部始终显示10行分页和搜索框,但不想显示"显示条目"下拉列表.

Answer 1

您可以直接在此链接上找到更多信息: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":false,是你需要改变的:)

Answer 2

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

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

Answer 3

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

Answer 4

"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

Answer 5

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

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

CDN JS：

• https://code.jquery.com/jquery-3.3.1.min.js
• https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js
• https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js
• https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js

CDN CSS：

• https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css
• https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css

Answer 6

sDom:"Tfrtip"或通过回调:

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

Answer 7

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

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

工作正常,但对于1.10+试试这个:

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

我们遗漏了l"长度变化的输入控制"

1.9文件

1.10文件

Answer 8

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

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

Answer 9

你也可以尝试这个。

只需使用 CSS 隐藏它，

 .dataTables_length {
        display: none;
    }

两者都会起作用。

Answer 10

写就好了 ：

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