cro*_*ony 0 jquery datatables twitter-bootstrap
我正在为我的网格视图使用 datatables.net。在搜索框中,它正在从所有列中搜索。但我想要像下面这样的场景。
我有 5 列,可以说 - 姓名、年龄、号码、地址、性别。我希望下拉列表中的所有这些选项以及当用户选择名称并在搜索框中输入文本时的下拉列表中,它只会在名称列中搜索。同样明智的是,如果用户从下拉列表中选择年龄,他只能在年龄列上进行搜索。
我看过很多例子,它们与我需要的不同。
这真的很容易,以各种方式多次询问 - 但令人惊讶的是我找不到完全匹配的。如果您有一个<select>
对应于您的列:
<select id="select">
<option>Seq.</option>
<option>Name</option>
<option>Position</option>
<option>Office</option>
<option>Start date</option>
<option>Salary</option>
</select>
Run Code Online (Sandbox Code Playgroud)
然后你可以劫持搜索框.unbind()
并定位对应于 selects' 的列selectedIndex
:
$('.dataTables_filter input').unbind().bind('keyup', function() {
var colIndex = document.querySelector('#select').selectedIndex;
table.column( colIndex).search( this.value ).draw();
});
Run Code Online (Sandbox Code Playgroud)
演示 -> http://jsfiddle.net/8fLagfyp/
BTW: You can reset previous search when the select is changed by
$('#select').change(function() {
table.columns().search('').draw();
});
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
9357 次 |
最近记录: |