jQuery 数据表从所选选项列排序和排序

Question

我有一个 jquery 数据表，我需要在包含 html 选择输入的单元格内按所选选项 <select><option selected="selected">**text to filter**</option></select> 中的文本进行过滤和排序.

因此，我需要搜索表中包含 td 的行，该 td 包含一个选择框，我在其中选择了带有用于搜索的文本的选项。

因此，如果在单元格中我选择带有“要过滤的文本”文本的选项，则该行必须可见。 是否可以？我该怎么做？

谢谢

Answer 1

我认为您会想要使用自定义过滤。 http://datatables.net/release-datatables/examples/plug-ins/range_filtering.html

查看这个jsfiddle:http://jsfiddle.net/DYyLd/

搜索“x”，仅显示选中“x”的行。更改所选选项，搜索将酌情找到/省略它。

$.fn.dataTableExt.afnFiltering.push(
    function( oSettings, aData, iDataIndex ) {
        var oTable = $('#myTable').dataTable();
        var nodes = $(oTable.fnGetNodes(iDataIndex));
        var selItem = nodes.find('select').val();

        // This is basic.  You should split the string and look
        // for each individual substring
        var filterValue = $('div.dataTables_filter input').val();

        return (selItem.indexOf(filterValue) !== -1);
    }
);

另外，我添加了这个:

$('select').click(function() { $('#myTable').dataTable().fnDraw(); });

当任何选择发生更改时，它会重新绘制表格 - 这样，它们就会被重新过滤。

如示例中所述，我的搜索功能非常基本，仅查看选择框中的所选项目是否包含搜索字段中的确切文本(区分大小写)。您几乎肯定希望用空格分割字符串，并在 selItem 中搜索每个子字符串。另请注意，此方法不会搜索其他列 - 它仅在带有选择框的列中查找。您可能还想搜索其他列。