如何在能够使用API​​进行搜索时忽略搜索中的字段?

时间:2017-05-04 12:19:21

标签: javascript datatables

我的表包含thre列; “名称”,“描述”和“状态”。我有一个下拉字段,用于过滤状态列上的表。基本上:

$('.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 :-(
}

理想情况下,(标准)自由文本搜索字段应忽略stuatus列,但下拉代码仍应正常工作。

1 个答案:

答案 0 :(得分:1)

这有效:

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

        $('#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;
                }
            );
        }