使用JavaScript数据源的DataTables

Question

我试图在此处的模板后面使用JavaScript对象作为数据源来实现一个简单的dataTables示例（第二个示例）。 请参见下面的代码：

$("#dynamicScenarioTblContainer div:last table").DataTable({ //initialize table with extras
    "data"   : [{"NoData": "no data"}],
    "columns": [{ "data" : "NoData" }]
}); 

尽管代码似乎遵循与示例相同的逻辑

'未捕获的TypeError：无法读取未定义的属性'length'

更新：

var DSDefaultSettings = '<table class="display compact" cellspacing="0" width="100%"><tr><thead></thead></tr><tbody></tbody>/table>';
$("#dynamicScenarioTblContainer").append("<div></div>")
$("#dynamicScenarioTblContainer div:last").html(DSDefaultSettings);

$("#dynamicScenarioTblContainer div:last table").DataTable({ //initialize table with extras
    "data": [{"NoData": "no data"}],
    "columns":  [{ "data": "NoData" }]
});  

Answer 1

您的表中没有tbody元素，并且thead不应由tr封装。

参考： http : //www.w3schools.com/tags/tag_thead.asp

该表的正确HTML应该是：

var DSDefaultSettings = '<table class="display compact" cellspacing="0" width="100%"><thead></thead><tbody></tbody></table>';