如何在javascript和jquery中隐藏数据表显示项



我正在使用jQuery的DataTable插件,并使用show entries(datatables_length(来创建一个下拉列表,以选择一次在页面上显示多少个条目。我还有一个内置的小搜索函数,由DataTable提供,用于搜索所需的条目。我正在努力隐藏页面上的显示条目下拉列表,仅当DataTable搜索在搜索栏中没有找到任何匹配的数据时。下面是我的代码。如果搜索函数返回null或没有匹配值,请帮助我隐藏显示条目下拉列表。

$(document).ready(function() {

$('#table').DataTable() {
'oLanguage': {
'sSearch': '<span>Search</span>'
},
lengthMenu : [ 5, 10, 15, 20],
pagingType: 'full_numbers'
});
searchForData();
});
function searchForData() {
$('.datatable_filter input[type="search"])
.attr('placeholder', 'person Id', 'Person name')
.css({'width':'500px', 'display':'inline-block'});
}
});

此处可以使用drawCallback选项

$(document).ready( function () {
var table = $('#table').DataTable({
drawCallback: function(){
var api = this.api();
var records = api.page.info().recordsDisplay;
var pageMenu = $('div.dataTables_length');
if (records === 0) {
pageMenu.hide();
} else if (pageMenu.css('display') == 'none') {
pageMenu.show();
}
// HERE IS YOUR FUNCTION TO CUSTOM YOUR SEARCH INPUT
searchForData();   
}
});
});

一个活生生的例子:http://live.datatables.net/pecafifi/2/edit

如果您使用的是版本<1.10,则必须使用fnDrawCallback选项

最新更新