javascript - 从 JavaScript 源数据表中获取过滤后的数据数组

Question

我的数据表版本是1.10.4。 我通过传递 Javascript 源数据来填充数据表

var dataSet = [
    ['Trident', 'Internet Explorer 4.0', 'Win 95+', '4', 'X'],
    ['Trident', 'Internet Explorer 5.0', 'Win 95+', '5', 'C']
    //----
];



$(document).ready(function () {
    $('#demo').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>');

    $('#example').dataTable({
        "data": dataSet,
        "columns": [
            { "title": "Engine" },
            { "title": "Browser" },
            { "title": "Platform" },
            { "title": "Version", "class": "center" },
            { "title": "Grade", "class": "center" }
        ]
    });
});

现在我有一个搜索输入来根据输入过滤表格。 我正在尝试获取返回并在表中呈现的过滤数据。

例如，如果用户搜索输入是“C”，那么我应该获得过滤后的数据

var 数据集 = [ ['三叉戟','Internet Explorer 5.0','Win 95+','5','C'] ];

是否有任何标准方法可以在数据表中获取过滤数据？

如果不是，我想在按键上获取数组

$( "#searchInput").on( 'keyup change', function () {
    // get the filtered JavaScript data
});

请引用JSFIDDLE HERE

Answer 1

您可以使用 search.dt 事件来实现此目的(这里假设您已将 dataTable 的实例存储在 table 变量中):

$("#example").on('search.dt', function() {
    var filteredRows = table
                       .api()
                       .rows( {order:'index', search:'applied'} )
                       .data();

    for (var i=0; i<filteredRows.length; i++) {
        console.log(filteredRows[i]);
    };    
});        

这将按照在 dataSet 对象中声明的顺序在控制台中回显所有已过滤的行:

["Gecko", "Firefox 3.0", "Win 2k+ / OSX.3+", "1.9", "A"]
["Gecko", "Camino 1.0", "OSX.2+", "1.8", "A"]
["Gecko", "Camino 1.5", "OSX.3+", "1.8", "A"]
["Gecko", "Netscape 7.2", "Win 95+ / Mac OS 8.6-9.2", "1.7", "A"]

等等。 注意，如果您使用 DataTable() 而不是 dataTable() 实例化表格，则不需要 api()引用。

fork fiddle -> http://jsfiddle.net/fpbokb68/

<小时/>

参见https://datatables.net/reference/type/selector-modifier 包含从 dataTables 实例中提取行的不同方法的示例。