[英]Filter jquery datatable rows
我正在处理此表,如果该列没有数据,则该表需要过滤行。 我可以过滤掉整个表,但是在过滤特定列的行时遇到了麻烦。 任何帮助将非常感激。
https://jsfiddle.net/mleitao/twg0qqq2/
$(document).ready(function() {
$('#camera').click(function() {
$("#table-ActiveRooms tr td").each(function() {
var cell = $(this)
if (cell.children().length == 0) {
$(this).parent().hide();
}
});
});
$('#btnReset').click(function() {
$("#table-ActiveRooms tr").each(function() {
$(this).show();
});
});
});
您得到的一些建议过于复杂。 您不需要使用.each
,也不需要if
语句来检查空值。
通过修改您的选择更具体一点,你的代码可以更清洁,更高效,而无需使用单独的each
或if
。
看到这里: https : //jsfiddle.net/twg0qqq2/44/
$(document).ready(function() {
$tableRows = $("#table-ActiveRooms tr");
$('#camera').click(function() {
$tableRows.has("td:nth-child(2):empty").hide();
});
$('#monitor').click(function() {
$tableRows.has("td:nth-child(3):empty").hide();
});
$('#phone').click(function() {
$tableRows.has("td:nth-child(4):empty").hide();
});
$('#btnReset').click(function() {
$tableRows.show();
});
});
nth-child(2)
代表列2。您可以假设,我们只需更改此数字即可与monitor
和phone
匹配。
您需要专门选择与所选过滤器相对应的td
才能起作用。 在代码中,当行中的任何td
为空时,您将隐藏tr
。
您可以添加一个类来标识这些td,就像这个小提琴一样: https : //jsfiddle.net/ttk2dy3f/2/
编辑:对不起,我忘了保存小提琴,现在做
这将基于下拉列表进行过滤,您可以将其应用于代码。 data [1]是要过滤的列。
var employeeName = '';
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
if (data[1].indexOf(employeeName) > -1) {
return true;
}
else {
return false;
}
}
);
$(document).ready(function () {
$('#employeeSelection').change(function (event) {
employeeName = $('#employeeSelection').val();
table.draw();
});
var table = $('#mainGrid').DataTable({
paging: false,
ordering: true,
aaSorting: [],
scrollX: true,
searching: true,
dom: 'Bfrtip',
buttons: [
'print'
]
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.