Question

我有一个jQuery DataTable对象，它包含日志信息 - 一个应用程序在特定日期范围内记录的Exception类型的日志消息，信息等。我希望在将日志消息发送到底层数据库时更新这些值。我目前正在使用javascript在HTML表格中找到基于AppId的单元格，并使用新的日志总数更新innerHTML。但是，由于并非所有应用程序都可见，例如如果有15但表只设置为显示10个条目，我想更新DataTable对象中的值，以便在表中包含应用程序时/当值正确。

我尝试过这样的事情来改变DataTable中的值

var rows = table.rows().data();
var arr = data.aaData;
for (var i = 0; i < arr.length; i++) {
        for (var r = 0; r < rows.length; r++) {
            if (arr[i].ApplicationId == rows[r].AppId) {
                if (arr[i].Debug != 0 || arr[i].Information != 0 || arr[i].Message != 0 || arr[i].Warning != 0 || arr[i].Exception != 0) {
                    //New Exception Count
                    if (arr[i].Exception !== 0) {
                        rows[r].Exception = arr[i].Exception;
                        flash(rows[r].AppId, 'Exception');
                    }
                    //New Warning Count
                    if (arr[i].Warning !== 0) {
                        rows[r].Warning = arr[i].Warning;
                        flash(rows[r].AppId, 'Warning');
                    }
                    //New Message Count
                    if (arr[i].Message !== 0) {
                        rows[r].Message = arr[i].Message;
                        flash(rows[r].AppId, 'Message');
                    }
                    //New Information Count
                    if (arr[i].Information !== 0) {
                        rows[r].Information = arr[i].Information;
                        flash(rows[r].AppId, 'Information');
                    }
                    //New Debug Count
                    if (arr[i].Debug !== 0) {
                        rows[r].Debug = arr[i].Debug;
                        flash(rows[r].AppId, 'Debug');
                    }
                }
            }
        }
    }
    table.draw();

其中data.aaData是从控制器方法返回的JSON格式数据。将rows记录到控制台我可以看到DataTable对象中的值已更新，但在table.draw()调用期间，这些新值不会呈现给HTML表。

那么有没有人有一种标准方法来更改DataTable中的值？我曾尝试使用table.cell(r, 5).data(someNewValue);，但这似乎会产生一些不可靠的结果。

Answer 1

奇怪您的table.cell(r, 5).data(someNewValue)尝试无效。无论如何，你可以走另一条路，当然。这里的关键字是使用invalidate()。如果我们有一张桌子：

<table id="example"></table>

以及JSON格式的一些数据

var data = [
    { "name" : "david", "lastname" : "konrad" }
];

并像这样初始化dataTable

var table = $('#example').DataTable({ 
    data : data,
    columns : [
        { data : "name", title :'name' },
        { data : "lastname", title : 'last name' }
    ]
})

然后您可以通过以这种方式更新data JSON来更改dataTable的内容：

data[0].name = 'sam';
data[0].lastname = 'gregory';

table.row(0).invalidate().draw();

表示特定行，或只是

table.rows().invalidate().draw();

表示整个数据集。

演示 - ＆gt;的 http://jsfiddle.net/vvzvxarf/

<强>更新即可。您可以使用AJAX数据源执行与上面完全相同的操作：

$('#example').DataTable( {
  ajax: {
    url: "someUrl",
    dataSrc: function(json) {
       //manipulate the data JSON as you wish
       //in this case, you dont need to invalidate() or draw()
       //...
       return json.data;
    }
})

更新II 。在呈现表之后操作AJAX数据。只需将响应JSON“复制”到您稍后可以操作的变量即可。变量只是一个参考。一个小例子：

var data; var table = $("#example").DataTable({ ajax : { url : 'data.json', dataSrc : function(json) { data = json.data; return json.data; } }, columns : [ { data : 'first_name' } ] }) setTimeout(function() { data[0].first_name = 'sam'; table.row(0).invalidate().draw(); }, 100)

结果与我的第一个例子完全相同。

jQuery DataTable - 更新值并呈现到HTML表

1 个答案: