column().search()
在选定列中搜索数据。
说明
虽然 search()
提供在表格中全局搜索的能力,此方法及其复数形式则提供在特定列中搜索数据的能力。
DataTables 未内置任何列搜索控件,因为有许多不同的方式可以搜索列特定数据,但此方法使添加自定义列搜索控件变得极其容易。下面的示例展示了它的使用方式。
请注意,DataTables 中的此搜索功能实际上从技术上来说是一个过滤器,因为它具有减法性。但是,我们称之为搜索,以避免与 filter()
辅助方法的名称重叠。
请注意,此方法将搜索设置为仅应用于表中 - 它实际上没有执行搜索。要执行搜索并显示结果,请使用 draw()
方法,它可以简单地调用为 column().search()
方法返回的对象的链接方法 - 例如 table.column( 0 ).search( 'Fred' ).draw();
。这是为了提供在执行绘制之前对多个更改进行排队的能力。
类型
function column().search( input [, options] )
- 说明
设置用于选定列的搜索项,并配置选项。在设置搜索项后调用
draw()
以更新表格的视图。- 参数
名称 类型 可选 1 input
否 应用于该列的搜索。
从 DataTables 2 起,此参数可以表示为正则表达式或函数。
如果使用正则表达式,提供的数据是相关列中单元格的搜索数据。
如果是函数,则对每一行调用该函数,并传递 4 个参数
- 列的搜索字符串
- 行的原始数据对象
- 行的 data 索引
- 列的 data 索引
应返回一个布尔值:
true
表示保留该行,false
表示将其滤除。请注意,如果为此参数提供了正则表达式或函数,则将忽略以下参数。
2 options
否 搜索如何执行的配置选项。请参阅
DataTables.SearchOptions
了解所有选项的说明。如果没有在此处给出选项,则将使用前一次搜索中设置的值。- 返回值
DataTables API 实例
函数 column().search( input [, regex[ , smart[ , caseInsen ]]] )
- 说明
从选择器中设置列的搜索项。请注意,自 DataTables 2 起,以上签名是首选的,因为它提供额外的选项。保留此签名是为了向后兼容。
- 参数
名称 类型 可选 1 input
否 要应用的搜索项。有关详细信息,请参阅上面签名描述中的
input
参数。2 regex
是 - 默认值:否 是否作为正则表达式对待(
true
)或不作为正则表达式对待(默认值,false
)。3 smart
是 - 默认值:是 执行智能搜索(默认值,
true
)或不执行智能搜索(false
)。请注意,为了执行“智能”搜索,DataTables 使用正则表达式,所以如果你在作为此方法的第二个参数传入一个正则表达式,则可能会希望禁用智能搜索,以便这两个不同的正则表达式不会产生冲突。4 caseInsen
是 - 默认值:是 是否执行不区分大小写的匹配(默认值,
true
)或不执行不区分大小写的匹配(false
)。- 返回值
DataTables API 实例
示例
单个列搜索
var table = new DataTable('#myTable');
// #column3_search is a <input type="text"> element
$('#column3_search').on('keyup', function () {
table
.columns(3)
.search(this.value)
.draw();
});
用select-filter
类构建针对每个列的搜索。
var table = new DataTable('#myTable');
table.columns('.select-filter').every(function () {
var that = this;
// Create the select list and search operation
var select = $('<select />')
.appendTo(this.footer())
.on('change', function () {
that.search($(this).val(), { exact: true }).draw();
});
// Get the search data for the first column and add to the select list
this.cache('search')
.sort()
.unique()
.each(function (d) {
select.append($('<option value="' + d + '">' + d + '</option>'));
});
});
带有函数的单个列搜索
let table = new DataTable('#example');
// Find any row with data in column index 3 greater than 50
table
.column(3)
.search((d) => d > 50)
.draw();
相关内容
以下选项直接相关,并且在应用开发中也可能有用。