我正在设计一个 数据表 表,以满足一组特定的标准。
不幸的是,这似乎是DataTables中两个相互矛盾的需求。
此代码允许将搜索栏限制为第一列,
numCols = $("#myTable thead tr:first th").length columns = [{ "searchable": true }] for (var i=1; i < numCols; i++) { columns.push({ "searchable": false }); var table = $('#myTable').DataTable({ "paging": false, "columns":columns });
但是,当使用 column.search() 时,这段代码:
column.search()
$("#myTable thead tr:first th").each( function ( i ) { if ($(this).hasClass("filter")) { var select = $('<select name="select_column_'+i+'"><option value="">ALL</option></select>') .appendTo( $(this).empty() ) .on( 'change', function () { table.column(i) .search( $(this).val(),false,false,false) .draw(); table.column( i ).data().unique().sort().each( function ( d, j ) { select.append( '<option value="'+d.replace(/[[\]\/()]/g,'\\$&')+'">'+d+'</option>' ) });
现在,我知道我已经在表的 searchable 声明中将 columns 设置为false,删除它可以让下拉列表再次工作-但这意味着搜索文本框会过滤所有列上的表,而不仅仅是第一列。
searchable
columns
遗留文档说,有一个 bFilterable 选项做了一个simialr的事情,但这不再是在当前的版本。现在我已经没有主意了。
bFilterable
因此,是否有一种方法可以限制数据表,使搜索框只在一个列上筛选,同时允许对其他列进行基于下拉的筛选?
PS: 对于好奇的人来说,这里的jsFiddle非常清楚地显示了这个问题。
618夏日盛惠
2核2G云服务器首年95元,GPU云服务器低至9.93元/天,还有更多云产品低至0.1折…
事实证明,使用标准的Datatables是不可能的,但是使用jQuery可以扩展表来管理这个表。
首先,保留对将要搜索的每一列的搜索(因此不包括列上的任何 searching 选项。
searching
然后,通过删除 选项 标志,使用 f 旋转筛选框。
f
然后在表本身之前创建一个自定义搜索框:
$('<input type="text" />') .insertBefore('#myTable') .before('<label>My special search: </label>')