Jquery数据表排序行

Question

注意:我将隐藏数据列,因此我必须使用Jquery Datatable api.

对于我的Jquery Datatable,每行旁边都有一个按钮.该按钮的目的是检索列数据.列数据将被隐藏.

对于我的按钮点击事件,这是我的代码.

    $('#Table').on('click', '.Button', function () {
        var tr = $(this).closest("tr");
        var rowindex = tr.index();
        //Get row based on index
        var rowData = $("#Table").DataTable().row(rowindex).data();
        var data = rowData.Data;
    });

这段代码正在运行,但有一个问题.
它无法检索已排序列的数据.

例如,在排序之前,
第1行 - 索引0数据 -
第2行 - 索引1数据 - B.

排序后,
第2行 - 索引0数据 - B
行1 - 索引1数据 - A

单击数据B行按钮,数据得到:A

希望我已经清楚地解释了我的问题.谢谢!

更新的小提琴:https://jsfiddle.net/mt4zrm4b/3/

Answer 1

您需要传入选择器tr作为rowSelector参数row().

DOM元素可以作为行选择器给出,以从该DOM元素中选择DataTabels API中的行.当您只有DOM节点供参考时(例如在事件处理程序中),这对于从行获取数据或执行其他基于行的操作非常有用.

原因是因为如果要进行排序,DataTables不会更新的行索引.建议通过您选择行tr,如下所示:

$('#Table').on('click', '.Button', function() {
    var tr = $(this).closest("tr");

    // Get row based on tr instead.
    var rowData = $("#Table").DataTable().row(tr).data();
    var data = rowData.Data;
    alert(data);
});

有关示例,请参阅此更新的小提琴.