jquery datatable 多条件查询
时间: 2023-07-27 20:07:10 浏览: 219
jQuery Datatable 多个查询条件自定义提交事件(推荐)
可以通过设置 DataTables 的搜索选项来实现多条件查询,以下是一个示例:
```javascript
$('#example').DataTable({
"processing": true,
"serverSide": true,
"ajax": "data.php",
"columns": [
{ "data": "name" },
{ "data": "position" },
{ "data": "office" },
{ "data": "age" },
{ "data": "start_date" },
{ "data": "salary" }
],
"search": {
"regex": true,
"smart": false
},
"initComplete": function() {
var api = this.api();
// 添加多条件查询输入框
api.columns().indexes().flatten().each( function ( i ) {
var column = api.column( i );
$( '<input type="text" placeholder="Search '+column.header()+'" />' )
.appendTo( $(column.footer()).empty() )
.on( 'keyup change clear', function () {
if ( column.search() !== this.value ) {
column
.search( this.value )
.draw();
}
} );
} );
}
});
```
上面代码中,我们通过 `search` 选项设置了搜索方式为正则表达式,并且禁用了智能搜索。然后在 `initComplete` 回调函数中,通过遍历 DataTables 中的每一列,并在每一列的表尾添加了一个输入框,用于输入多条件查询关键字。每当输入框中的值发生变化时,就会调用 `column.search()` 方法执行查询操作。这样就实现了多条件查询功能。
阅读全文