重新加载后jquery datatable突出显示下降 [英] jquery datatable highlight drops off after reload

问题描述

我有一个使用ajax加载值的数据表.

I have a datatable which uses ajax to load the values.

var table = $('#example').DataTable({
    "ajax": "xxxxxx.aspx",
    stateSave: true,
        "aLengthMenu": [
        [10, 25, 50, 100],
        [10, 25, 50, 100]
    ],
        "iDisplayLength": 25,
        "order": [
        [0, "desc"]
    ],
    columnDefs: [{
        "visible": false,
        "targets": [2, 3]
    }, {
        "type": 'date-uk',
        "targets": [1, 9, 10]
    }, {
        "type": 'title-string',
        "targets": [11]
    }],
});

$('#example tbody').on('click', 'tr', function () {
    if ($(this).hasClass('selected')) {
        $(this).removeClass('selected');
    } else {
        table.$('tr.selected').removeClass('selected');
        $(this).addClass('selected');
    }
});

使用setInterval，我要求该表每5秒重新加载一次.

using setInterval, I am asking that table to be reloaded every 5 secs.

setInterval(function(){table.ajax.reload(null, false)}, 5000);

重新加载数据表时，它将从突出显示行中删除.有人可以告诉我如何在重新加载后在行中保留高亮显示吗?

When the Datatable is reloaded, it drops off the highlight row. Can anyone please tell me how to retain the highlight on the row after the reload?

谢谢

推荐答案

您可以执行以下操作:

function highlight() {
    $('#example tbody').on('click', 'tr', function () {
        if ($(this).hasClass('selected')) {
            $(this).removeClass('selected');
        } else {
            table.$('tr.selected').removeClass('selected');
            $(this).addClass('selected');
        }
    });
}

$(document).ready(function () {

    // Call the function at document ready
    highlight();

    // Call the ajax and the function every 5 seconds
    setInterval( function () {
        table.ajax.reload(null, false);
        highlight();
    }, 5000 );

});

这篇关于重新加载后jquery datatable突出显示下降的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！