使用对象数组更新数据表答案

【问题标题】：Update datatable using an array of objects使用对象数组更新数据表
【发布时间】：2018-04-08 14:30:59
【问题描述】：

我在下面有一个对象数组。

   var arrayObjects= [
    {
        "name":       "Tiger Nixon",
        "position":   "System Architect",
        "salary":     "$3,120",
        "start_date": "2011/04/25",
        "office":     "Edinburgh",
        "extn":       "5421"
    },
    {
        "name":       "Garrett Winters",
        "position":   "Director",
        "salary":     "$5,300",
        "start_date": "2011/07/25",
        "office":     "Edinburgh",
        "extn":       "8422"
    }
]

该数组是通过我的应用进行的一些 API 调用动态更新的。

我实例化一个数据表如图。此时的数组，arrayObjects为空。

HTML
<table id="myTable" class="table table-striped table-dark">
         <thead>
          <tr>
              <th>Name</th>
              <th>Position</th>
              <th>Salary</th>
              <th>Office</th>
          </tr>
      </thead>
    </table>
JAVASCRIPT
var myDataTable=$('#myTable').DataTable( {
    data: arrayObjects,
    columns: [
         { data: 'name' },
         { data: 'position' },
         { data: 'salary' },
         { data: 'office' }
    ]
} );

我在数组中添加新对象如下：

编辑：一些数据可以如下：

var somedata = {
        "name":       "James",
        "position":   "CEO",
        "salary":     "$13,140",
        "start_date": "2017/04/25",
        "office":     "London",
        "extn":       "54211"
    }
arrayObjects.push(somedata);

之后如何向表中添加数据/更新表？我试过了：

myDataTable.clear().row.add(arrayObjects).draw();

但它似乎不起作用。表格仍然是空的。

【问题讨论】：

你从哪里得到somedata？
添加一行意味着每次传递一行数据。当您将someData 推送到数组时，也添加为行，然后在添加所有行后调用 draw
@PrashantPokhriyal 我已将问题更新为更清楚，希望对您有所帮助。

标签： javascript jquery datatables

【解决方案1】：

问题在于使用row API 而不是rows API，因为您将存储为对象数组。

改成

myDataTable.clear().rows.add(arrayObjects).draw();

工作jsfiddle.

要使用row API，您必须将arrayObjects 更改为简单数组或单个对象，如下所示

var arrayObjects = ['James', 'CEO', '$13000', 'London'];
// or
var arrayObjects = {
  "name": "James",
  "position": "CEO",
  "salary": "$13,140",
  "office": "London"
};

// it will work now
myDataTable.clear().row.add(arrayObjects).draw();

【讨论】：