How to update Datatable data from js array of objects
I am using jquery DataTables plugin to display an array of objects. I would like to clear the table and redraw using the changed data. However, the only way I was able to do this was by destroying the table and reinitializing. I would like to know if there is an easy way to update from a JS datasource. This is what I am doing, it works, but it doesn't feel right ...
if (NAMESPACE.table){
NAMESPACE.table.destroy();
}
NAMESPACE.table = $('#assets-table').DataTable({
"data": filteredData,
"columns": [
{ "data": "id" },
{ "data": "type" },
{ "data": "city" },
{ "data": "state"}
]
});
Make it easier:
NAMESPACE.table = $('#assets-table').DataTable({
"data": filteredData,
"columns": [
{ "data": "id" },
{ "data": "type" },
{ "data": "city" },
{ "data": "state"}
],
"destroy": true
});
if you want to clear the data present in the dataTable just call table.clear()
, it will clear all cells in the table.
and then add new data with table.row.add().draw()
;
table.destroy()
does not delete the data present in the table cell, it only destroys the current instance of the created dataTable.