javascript - 列过滤DataTable,去掉特定列过滤
问题描述
我正在使用 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(第一列)构建输入控件。因此,您可以在该函数中使用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();
}
});
}
});
推荐阅读
- indexing - Google Sheets - 使用 API 获取工作簿中的 gid 列表
- c# - 在实体接口(EF Core)中声明要忽略的属性
- react-admin - 找出何时调用刷新
- javascript - 如何使用js或php将填写类名的表作为html文件保存在我的本地磁盘中?
- proxy - elixir+hex - 获取 ranch_proxy_protocol ssl 的 hex 错误:ssl_accept 3 deprecated
- android - 如何在 Recycler View 中添加整数值
- angular - 您如何实现自动生成的不同数量的选项卡?
- r - ddply with which.max 函数
- php - 如何在 PHP 中使用 Select 选项从数据库中获取数据?
- linux - 在linux终端中复制和粘贴