javascript - 如何在能够使用 API 进行搜索的同时忽略搜索中的字段？

Question

我的表包含三列； “名称”、“描述”和“状态”。我有一个下拉字段，用于过滤状态列上的表。本质上:

$('.js-status-dropdown').dropdown({
    onChange: function (value) {
        $('#dt').DataTable().column('status:name').search(value).draw();
    }
});

这可行，但问题是标准自由文本搜索输入字段包括自由文本搜索中的状态字段。

在状态字段上设置 searchable: false 会导致下拉菜单停止工作，因为 Datatable 会忽略它。

{
    data: 'status',
    name: 'status',
    searchable: false // Stops table.column().search(value) from working :-(
}

理想情况下，(标准)自由文本搜索字段应忽略状态列，但下拉代码应仍然有效。

Answer 1

这有效:

1. 将该列设置为searchable: false。这使得表在自由文本搜索中忽略此列。
2. 添加一个自定义搜索，该搜索使用原始行数据、settings.aoData，而不是数据数组(由于 1，它不包含该列。)
3. 当过滤器下拉列表更改时重新绘制表格。

代码:

    $('#dt').DataTable(defaults)
            .on('init.dt', statusHandling);

    function statusHandling(e, settings, processing) {

        // Redraw table on dropdown status change
        $('.js-status-dropdown').dropdown({
            onChange: function (value) {
                $(options.table).DataTable().draw();
            }
        });

        // Our custom search function which adds an AND 'status = foo' condition
        $.fn.dataTable.ext.search.push(
            function (settings, data, dataIndex) {
                var input = $('input[name=status]').val().toLowerCase();
                // Use original data instead of 'data' because status is not searchable
                var status = settings.aoData[dataIndex]['_aData']['status'];
                return status.toLowerCase().indexOf(input) === 0;
            }
        );
    }