Question

我的dataTable版本是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 dataSet = [ ['Trident'，'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()引用。

分叉小提琴 - ＆gt;的 http://jsfiddle.net/fpbokb68/

请参阅 https://datatables.net/reference/type/selector-modifier ，其中提供了从dataTables实例中提取行的不同方法的示例。

Answer 2

这是您的示例搜索; 你可以删除按钮并在你的区域添加onchange。

Search <input type="text" id="searchText">
<input type = "button" onClick="searchAndUpdate()">

这是功能;

     function searchAndUpdate(){
        var searchText = $('#searchText').val();
        var resultTable = [];
        dataSet.forEach(function(element) {
            var objString = JSON.stringify(element);
            if(objString.indexOf(searchText)!=-1){
                resultTable.push(element);
            }
        });
        console.log(resultTable);

        //update your table
    }

注意：您必须更新表格。 Here EXAMPLE.

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

2 个答案: