javascript - 列搜索后如何将所有DataTable的数据存储在javascript数组中?

标签 javascript jquery datatables

我的表格与 https://datatables.net/examples/api/multi_filter.html 中描述的完全一样。我的代码结构完全相同(请使用链接查看完整代码和演示)。

$(document).ready(function() {
    // Setup - add a text input to each footer cell
    $('#example tfoot th').each( function () {
        var title = $(this).text();
        $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );

    // DataTable
    var table = $('#example').DataTable();

    // Apply the search
    table.columns().every( function () {
        var that = this;

        $( 'input', this.footer() ).on( 'keyup change clear', function () {
            if ( that.search() !== this.value ) {
                that
                    .search( this.value )
                    .draw();
            }
        } );
    } );
} );

现在我想在执行搜索操作后返回表中的所有记录(行),可以通过 console.log() 或将数据保存在 javascript 数组中。

例如,当我在 Position 列中搜索 Accountant 后,我想获取存储在 javascript 数组中的全部数据

enter image description here

[[Airi Satou,Accountant,Tokyo,33,2008/11/28,$162,700],
[Garrett Winters,Accountant,Tokyo,63,2011/07/25,$170,750]]

我尝试过类似 console.log( table.row( this ).data() ); 但没有成功。如何实现这一目标?

最佳答案

尝试在 .draw() 之后添加此代码

table.rows().$('tr', {"filter":"applied"}).each( function () {
  console.log(table.row(this).data())
});

示例结果:

  • 多个
Array(6) [ "Airi Satou", "Accountant", "Tokyo", "33", "2008/11/28", "$162,700" ]
Array(6) [ "Dai Rios", "Personnel Lead", "Edinburgh", "35", "2012/09/26", "$217,500" ]
Array(6) [ "Jena Gaines", "Office Manager", "London", "30", "2008/12/19", "$90,560" ]
Array(6) [ "Zenaida Frank", "Software Engineer", "New York", "63", "2010/01/04", "$125,250" ]
  • 单例
Array(6) ["Zenaida Frank", "Software Engineer", "New York", "63", "2010/01/04", "$125,250"]

我还创建了一个 codepen,以防万一您想尝试: Individual column searching (text inputs)

关于javascript - 列搜索后如何将所有DataTable的数据存储在javascript数组中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60862146/

相关文章:

javascript - 自动宽度属性不适用于数据表

javascript - HighCharts 事件仪表填充了函数的系列数据

javascript - 输入 Reactjs 的预期相应 JSX 结束标记

jquery - 如何使用 jQuery 调用 ASP.NET MVC 3 操作?

javascript 如何逐字阅读并突出显示

javascript - 如何在数据表中格式化货币?

jquery - 从文本框中删除自动搜索并在搜索按钮上搜索

javascript - 为 img 和 input 元素添加自定义 id 属性

javascript - 根据整个路径轨迹的百分比在路径轨迹上移动 SVG 组

jQuery 验证插件在 IE 中清除文件输入值