[英]Column filtering DataTable, remove specific column filter
我正在使用 DataTables 库中的列过滤器,它为我的表中的每一列添加了一个过滤器,问题和我需要从第一列中删除过滤器,因为它是一个复选框。 我尝试了一些没有成功的事情,我将留下我正在使用的代码。
链接数据表: https://datatables.net/extensions/fixedheader/examples/options/columnFiltering.html
我的表:
<table id="table" class="table table-sm table-responsive display text-center" style="width:100%">
<thead>
<tr>
<th><input type="checkbox" id="selectAll" /></th>
<th>Id</th>
<th>Filial</th>
<th>Serie</th>
<th>Documento</th>
<th>Nop</th>
</tr>
</thead>
</table>
JS:
$(document).ready(function () {
$("#selectAll").click(function () {
let select = $(this).is(":checked")
$("[type=checkbox]").prop('checked', select)
})
});
$(document).ready(function () {
$('#table thead tr').clone(true).appendTo('#table thead');
$('#table thead tr:eq(0) th').each(function (i) {
$(this).html('<input type="text" />');
$('input', this).on('keyup change', function () {
if (table.column(i).search() !== this.value) {
table
.column(i)
.search(this.value)
.draw();
}
});
});
为避免一开始就绘制控件,请查看以下行:
$('#table thead tr:eq(0) th').each( function (i) {
这里, i
代表循环计数器。 当计数器为 0 时,您正在为列索引 0(第一列)构建输入控件。 因此,您可以在 function 中使用if(i > 0) {... }
语句来忽略循环的第一次迭代。
因为您正在克隆第一列中已经包含复选框的标题行,所以您可能还需要使用$( this ).empty();
删除“克隆”复选框。 .
$('#table thead tr:eq(0) th').each(function(i) {
if (i == 0) {
$( this ).empty();
} else {
var title = $(this).text();
$(this).html('<input type="text" />');
$('input', this).on('keyup change', function() {
if (table.column(i).search() !== this.value) {
table
.column(i)
.search(this.value)
.draw();
}
});
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.