【问题标题】:how to update a row in datatables without table redraw?如何在不重绘表的情况下更新数据表中的行?
【发布时间】:2013-01-19 06:33:42
【问题描述】:

我有从 javascript 数组填充的 dataTables v1.9.4,并且我有复选框列,如果它是 :checked,那么整行应该每 5 秒更新一次,问题是我有一个大的 fnRowCallback 函数在行更新后不执行,因此我所有的行结构都崩溃了。这是我的更新代码:

function updateRow(){
    newRowData = $.data(document.body, 'updatedData');
    var newRow = [];
    newRow.push(1, 1);
    for (var title in newRowData[0]){
        newRow.push(newRowData[0][title]);
    }
    oTable.fnUpdate( newRow, updateIndex, false, true);
};  

这是我的fnRowCallback

"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
                //make 3state button and indicator for relay mask & status
                $('td.relay', nRow).each(function(){
                    relayStatus = $(this).text();
                    $(this).html('<div class="hidden-value">' + relayStatus + '</div><div></div>');
                    if(relayStatus == 1){
                        $(this).children('div:last').addClass('relmas1');
                    }
                    if(relayStatus == 0){
                        $(this).children('div:last').addClass('relmas0');
                    }
                    if(relayStatus == -1){
                        $(this).children('div:last').addClass('relmas-1');
                    }
                });
                //makes update checkboxes
                var clientID = $('td.clientid', nRow).text();
                $('td.update', nRow).html('<input type="checkbox" data-clientid="' + clientID + '" />');
                //makes volumes
                var cuVol = parseInt($('td.volume', nRow).text(), 10)
                $('td.volume', nRow).html('<div class="volume-container"><div class="volume-tmp">' + cuVol + '</div><div class="volume-slider"></div></div>')
                $('td.volume div.volume-slider', nRow).slider({
                    value: cuVol,
                    range: "min",
                    orientation: "horizontal",
                    slide: function( event, ui ) {
                        cuVol = ui.value;
                        $(this).siblings('div.volume-tmp').text(ui.value);
                    }
                });
            },

问题是: 如何使用fnRowCallback 重绘单个选定行而不重绘整个表格并在重绘后保持其选中状态
编辑:
我仔细检查了我的代码,发现我的代码正在正确更新,但问题是我的代码以通过 ajax 接收的方式加载到表中,而不是我重新排序表列的方式

【问题讨论】:

    标签: javascript jquery arrays jquery-datatables


    【解决方案1】:

    您可以使用 fnUpdate。基本上它通过行索引工作,并且必须插入行的所有值(例如,当你有 4 列时不能输入 2 个值)

    这里是该方法的 API 链接:jQuery DataTable fnUpdate

    我认为它会触发行回调,但我不确定。

    【讨论】:

    • tnx for answer 你的答案几乎是正确的,我在大约 10 个月前解决了它!但是 tnx 它可以解决这个问题
    • 抱歉,未答复,没有看到日期。
    猜你喜欢
    • 1970-01-01
    • 2015-10-27
    • 2016-12-26
    • 2019-12-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-07-15
    • 2011-07-07
    相关资源
    最近更新 更多