Question

我必须用从Google电子表格中获得的一些数据填充数据表，我用HTML创建表，并用Jquery附加行。

问题在于，当数据表刷新时，即使下一行有数据，第一行也会显示“表中没有可用数据”。

这是我使用的代码的一部分

//此函数创建表行并将其附加到表主体

org.junit.Test

表的html代码也是这个

function displayUser() {

for (i = 0; i < userList.length; i++) {
    var $tblRow = $('<tr id="row' + i + '">');

    $tblRow.append('<td id="td' + i + '">' + userList[i][' inv-id']
        + '</td>');
    $tblRow.append('<td id="td' + i + '">' + userList[i]['inv-com-name']
        + '</td>');
    $tblRow.append('<td id="td' + i + '">' + userList[i]['inv-email']
        + '</td>');
    $tblRow.append('<td id="td' + i + '">' + userList[i]['email']
        + '</td>');
    $tblRow.append('<td id="td' + i + '">' + '<button onClick="editarUsuario(' + i + ')" class="btn btn-info btn-xs btn-edit">Edit</button>'
        + '</td>');
    $('#tbody').append($tblRow);
};
}

Here is a imagen that shows that the table appears to be empty even when the data was appended by the script, the first row is the message of "No data available in table" and says 0 entries below

我希望数据表能够加载并由从数据库获取数据的脚本填充。但是实际情况是，第一行说数据表为空，但接下来的行中有数据。

Answer 1

是的问题是，即使添加了内容，旧内容仍然存在。

我找到了解决方法。为了用我创建的内容替换内容，我不得不销毁并初始化jquery中的表。

function displayUser() {

var table = $('#dtVerticalScrollExample').DataTable();
table.destroy();

for (i = 0; i < userList.length; i++) {
    var $tblRow = $('<tr id="row' + i + '"/>');

    $tblRow.append('<td id="td' + i + '">' + userList[i][' inv-id'] + '</td>');
    $tblRow.append('<td id="td' + i + '">' + userList[i]['inv-com-name'] + '</td>');
    $tblRow.append('<td id="td' + i + '">' + userList[i]['inv-email'] + '</td>');
    $tblRow.append('<td id="td' + i + '">' + userList[i]['email'] + '</td>');
    $tblRow.append('<td id="td' + i + '">' + '<button onClick="edit(' + i + ')" class="btn btn-info btn-xs btn-edit">Edit</button>' + '</td>');

    $('#dtVerticalScrollExample').append($tblRow);

};
var table = $('#dtVerticalScrollExample').DataTable();

}

DataTable“表中没有可用数据”，即使有数据

1 个答案: