Question

我将dataSource定义为

function getData(){
     var arr = [];
     for(var i=0; i<1000; i++){
          var obj = {
               'name': 'John', 'company' : 'ABC Corp', 'salary': '$x'
         };
         arr.push(obj);
     }
     return arr;
}

表格呈现为

var arr = getData();
$('#table1').dataTable({
      'aaData': arr,
      'aoColumns': [
           {'sTitle': 'name'},
           {'sTitle': 'company'},
           {'sTitle': 'salary'}
      ]
}}

现在，当我尝试将新行添加到dataTable

时

$('#table1').dataTable.fnAddData([
      "&nbsp;", "&nbsp;", "&nbsp;"
]);

我收到错误

DataTables warning（table id ='table1'）：从行1001的数据源请求未知参数'name'

导致这种情况的原因是什么？

Answer 1

问题不在于您尝试添加新行。当您尝试将array objects作为aaData插入时，系统会显示该错误。您必须通过aoColumns：

定义与列对应的每个对象的哪个属性

var dataTable = $('#example').dataTable({
    aaData : arr,
    aoColumns: [
        {mDataProp: 'name'},
        {mDataProp: 'company'},
        {mDataProp: 'salary'}
    ]
});

现在从object到aaData的映射正常。请注意，如果您使用1.9.4或更高版本的数据表，mDataProp将重命名为mData（即使它仍然有效）。接下来，

$('#table1').dataTable.fnAddData([
  "&nbsp;", "&nbsp;", "&nbsp;"
]);

错了。 dataTables应该如何知道它应该如何处理该数组呢？它在您的控制台中引发了一个巨大的错误（您可能没有看到，因为脚本已经在aaData : arr暂停了。正确的方法是在您的dataTable对象上调用fnAddData，并插入数据以与aoColumns之前相同的方式应插入已定义的数据：

dataTable.fnAddData([
  'a', 'b', 'c'
]);

错了

dataTable.fnAddData(
  { name : "a", company : "b", salary : "c" }
);

是对的。请参阅上面的示例以及在此小提琴中运行的代码 - ＆gt;的 http://jsfiddle.net/krs6f/

在jQuery中向DataTable添加新行时出错

1 个答案: