Jquery 无法识别数据的数据表

我正在尝试将数据插入数据表

我有以下代码：

数据表：

<table id="ladder" class="table table-striped table-bordered" cellspacing="0" width="100%">
    <thead>
         <tr>
            <th>Place</th>
            <th>Team Name</th>
            <th>W - L</th>
            <th>Strk</th>
            <th>Exp</th>
            <th>Level</th>
         </tr>
     </thead>
     <tbody id="ladder_stats">

     </tbody>
</table>

放置
队名
W-L
Strk
费用
水平仪

JQuery：

function fillLadder(place, name, w, l, strk, exp, lvl, id, ladder) {

    $('<tr><td>' + place + '</td><td><a href="/team?id=' + id + '&l=' + ladder + '">' + name + '</a></td><td>' + w + ' - ' + l + '</td><td>' + strk + '</td><td>' + exp + '</td><td>' + lvl + '</td></tr>').appendTo('#ladder_stats');
}

function refreshLadder() {

    var ladder = $.urlParam('l');

    $.ajax({ 

     url: '/data/ladder_stats.php',
        data: {l: ladder},
        dataType: 'json',
        type: 'post',
        success: function(json) {

            console.log(json);

            for (i = 0; i < Object.keys(json).length; i++) { 
                fillLadder(json[i].place, json[i].name, json[i].wins, json[i].losses, json[i].strk, json[i].exp, json[i].level, json[i].id, ladder);
            }

        },
        error: function(ts) {
            console.log("Error: " + ts.responseText);
        }
    });
}


$(document).ready(function() {

    refreshLadder();
    $('#ladder').DataTable();
    $('#match_finder').DataTable();
});

函数填充梯形图（位置、名称、w、l、strk、exp、lvl、id、梯形图）{
$（''+place+''+w+'-''+l+''+strk+''+exp+''+lvl+''）。附加到（''阶梯统计'）；
}
函数refreshLadder（）{
var梯形图=$.urlParam（'l'）；
$.ajax（{
url:“/data/ladder_stats.php”，
数据：{l:ladder}，
数据类型：“json”，
键入：“post”，
成功：函数（json）{
log（json）；
对于（i=0；i

从代码中可以看出，在加载

DataTable（）

函数之前，我正在将数据插入表中。不幸的是，DataTables无法识别数据

---

根据代码，我认为这是由于时间原因。ajax调用可能需要一段时间，将datatables调用移动到success应该会起作用。更新到类似这样的内容

function fillLadder(place, name, w, l, strk, exp, lvl, id, ladder) {

    $('<tr><td>' + place + '</td><td><a href="/team?id=' + id + '&l=' + ladder + '">' + name + '</a></td><td>' + w + ' - ' + l + '</td><td>' + strk + '</td><td>' + exp + '</td><td>' + lvl + '</td></tr>').appendTo('#ladder_stats');
}

function refreshLadder() {

    var ladder = $.urlParam('l');

    $.ajax({ 

     url: '/data/ladder_stats.php',
        data: {l: ladder},
        dataType: 'json',
        type: 'post',
        success: function(json) {

            console.log(json);

            for (i = 0; i < Object.keys(json).length; i++) { 
                fillLadder(json[i].place, json[i].name, json[i].wins, json[i].losses, json[i].strk, json[i].exp, json[i].level, json[i].id, ladder);
            }

            //Rows created, now we can make tables
            $('#ladder').DataTable();
            $('#match_finder').DataTable();

        },
        error: function(ts) {
            console.log("Error: " + ts.responseText);
        }
    });
}


$(document).ready(function() {

    refreshLadder();
});

函数填充梯形图（位置、名称、w、l、strk、exp、lvl、id、梯形图）{
$（''+place+''+w+'-''+l+''+strk+''+exp+''+lvl+''）。附加到（''阶梯统计'）；
}
函数refreshLadder（）{
var梯形图=$.urlParam（'l'）；
$.ajax（{
url:“/data/ladder_stats.php”，
数据：{l:ladder}，
数据类型：“json”，
键入：“post”，
成功：函数（json）{
log（json）；
对于（i=0；i

基于代码，我认为这是由于时间原因。ajax调用可能需要一段时间，将datatables调用移动到success应该会起作用。更新到类似这样的内容

function fillLadder(place, name, w, l, strk, exp, lvl, id, ladder) {

    $('<tr><td>' + place + '</td><td><a href="/team?id=' + id + '&l=' + ladder + '">' + name + '</a></td><td>' + w + ' - ' + l + '</td><td>' + strk + '</td><td>' + exp + '</td><td>' + lvl + '</td></tr>').appendTo('#ladder_stats');
}

function refreshLadder() {

    var ladder = $.urlParam('l');

    $.ajax({ 

     url: '/data/ladder_stats.php',
        data: {l: ladder},
        dataType: 'json',
        type: 'post',
        success: function(json) {

            console.log(json);

            for (i = 0; i < Object.keys(json).length; i++) { 
                fillLadder(json[i].place, json[i].name, json[i].wins, json[i].losses, json[i].strk, json[i].exp, json[i].level, json[i].id, ladder);
            }

            //Rows created, now we can make tables
            $('#ladder').DataTable();
            $('#match_finder').DataTable();

        },
        error: function(ts) {
            console.log("Error: " + ts.responseText);
        }
    });
}


$(document).ready(function() {

    refreshLadder();
});

函数填充梯形图（位置、名称、w、l、strk、exp、lvl、id、梯形图）{
$（''+place+''+w+'-''+l+''+strk+''+exp+''+lvl+''）。附加到（''阶梯统计'）；
}
函数refreshLadder（）{
var梯形图=$.urlParam（'l'）；
$.ajax（{
url:“/data/ladder_stats.php”，
数据：{l:ladder}，
数据类型：“json”，
键入：“post”，
成功：函数（json）{
log（json）；
对于（i=0；i

你能这样试试吗：

function refreshLadder() {

    var ladder = $.urlParam('l');

    $.ajax({ 

     url: '/data/ladder_stats.php',
        data: {l: ladder},
        dataType: 'json',
        type: 'post',
        success: function(json) {

            console.log(json);

            for (i = 0; i < Object.keys(json).length; i++) { 
                fillLadder(json[i].place, json[i].name, json[i].wins, json[i].losses, json[i].strk, json[i].exp, json[i].level, json[i].id, ladder);
            }

            $('#ladder').DataTable(); //initiating it after appening all the rows
            $('#match_finder').DataTable();

        },
        error: function(ts) {
            console.log("Error: " + ts.responseText);
        }
    });
}


$(document).ready(function() {

    refreshLadder();

});

函数刷新梯形图（）{
var梯形图=$.urlParam（'l'）；
$.ajax（{
url:“/data/ladder_stats.php”，
数据：{l:ladder}，
数据类型：“json”，
键入：“post”，
成功：函数（json）{
log（json）；
对于（i=0；i

你能这样试试吗：

function refreshLadder() {

    var ladder = $.urlParam('l');

    $.ajax({ 

     url: '/data/ladder_stats.php',
        data: {l: ladder},
        dataType: 'json',
        type: 'post',
        success: function(json) {

            console.log(json);

            for (i = 0; i < Object.keys(json).length; i++) { 
                fillLadder(json[i].place, json[i].name, json[i].wins, json[i].losses, json[i].strk, json[i].exp, json[i].level, json[i].id, ladder);
            }

            $('#ladder').DataTable(); //initiating it after appening all the rows
            $('#match_finder').DataTable();

        },
        error: function(ts) {
            console.log("Error: " + ts.responseText);
        }
    });
}


$(document).ready(function() {

    refreshLadder();

});

函数刷新梯形图（）{
var梯形图=$.urlParam（'l'）；
$.ajax（{
url:“/data/ladder_stats.php”，
数据：{l:ladder}，
数据类型：“json”，
键入：“post”，
成功：函数（json）{
log（json）；
对于（i=0；i

就这样！！谢谢。我已经为此挣扎了一段时间：）一个简单的

columns

部分可以很容易地解决这个问题。解析JSON和手动插入表元素正是dataTables应该避免的。上面的解决方案并没有解决关于如何使用数据表的普遍误解，它只是解决了误解，因此看起来这是一种工作……OP如果尝试重新加载数据，将面临问题，我高度怀疑这就是

refreshLadder（）

…的目的！！谢谢。我已经为此挣扎了一段时间：）一个简单的

columns