Datatable jump to page which contains tr with certain class

时间:2016-12-09 12:58:36

标签: javascript jquery datatables

I am trying to use row().show() plugin to jump to page where is tr with class .scrollAndHightlight in my DataTable with id #reqToApp.

Here is my DT initialization with initComplete function:

var table = $('#reqToApp').DataTable({
    responsive: true,
    stateSave: true,
    fixedHeader: true,
    autoWidth: false,
    select: true,
    order: [[1, "desc"]],
    "iDisplayLength": 15,
    language: {
        "url": "/js/Czech.json"
    },
    "aoColumns": [
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "html"},
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "string"},
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "string"},
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "string"},
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "string"},
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "string"},
        {"bVisible": true, "bSortable": true, "bSearchable": true, "sType": "string"},
        {"bVisible": true, "bSortable": false, "bSearchable": false, "sType": "html"}
    ],
    "initComplete": function(settings, json){
        var row = table.row($(".scrollAndHighlight")).node();
        table.row(row).draw().show().draw(false);
    }
});

But it does nothing, no errors in console.

What am I doing wrong?

JSFiddle: https://jsfiddle.net/ebRXw/2427/

1 个答案:

答案 0 :(得分:2)

您不应该使用$() jQuery方法,因为它只能访问DOM中存在的元素。由于jQuery DataTables在DOM中不存在当前页面,因此无法找到除第一页以外的页面上的行。

您可以改为向row()方法提供CSS选择器。

例如:

"initComplete": function(settings, json){
   var api = new $.fn.dataTable.Api(settings);
   var row = api.row(".scrollAndHighlight").node();
   api.row(row).draw().show().draw(false);
}

请参阅updated jsFiddle以获取代码和演示。