Table dont update after changing JS Source Object

_Bernhard_ · February 2021

Hi, I create a table with JS Object as Source. Later on I change the object and want to update the table with rows().invalidate().draw(), which does not wor for me.

$(document).ready( function () {
  var data = [
    {a: "123", b: "123", c: "123", d: "123"},
    {a: "123", b: "123", c: "123", d: "123"},
  ];

  var col_conf = [
    {title: "a", data: "a"},
    {title: "b", data: "b"},
    {title: "c", data: "c"},
  ];

  var table = $('#Punkte').DataTable( {
    data: data,
    columns: col_conf
  } );

  data.push({a: "123", b: "123", c: "123", d: "123"});
  col_conf.push({title: "d", data: "d"});

  table.rows().invalidate().draw();
} );

This is the Link to my example, which looks like the same as in the official documentation: http://live.datatables.net/yimohega/3/edit?html,js,output

Thanks a lot in advance for all suggestions - I'm going crazy not finding out my error ;-)

kthorngren · February 2021

Datatables doesn't support dynamically changing the number of columns. You will need to use destroy() or destroy and reinitialize with the new column structure. See this thread for an example.

Kevin

_Bernhard_ · February 2021

Thanks a lot. That helped. With this code it's working:

$(document).ready( function () {
  var data = [
    {a: "123", b: "123", c: "123", d: "123"},
    {a: "123", b: "123", c: "123", d: "123"},
  ];

  var col_conf = [
    {title: "a", data: "a"},
    {title: "b", data: "b"},
    {title: "c", data: "c"},
  ];

  var table = $('#Punkte').DataTable( {
    data: data,
    columns: col_conf
  } );

  data.push({a: "123", b: "123", c: "123", d: "123"});
  col_conf.push({title: "d", data: "d"});

  table.destroy();
  $('#Punkte').empty();

  table = $('#Punkte').DataTable( {
    data: data,
    columns: col_conf
  } );
} );

Table dont update after changing JS Source Object

Table dont update after changing JS Source Object

Answers

Howdy, Stranger!

Categories

DataTables

Table dont update after changing JS Source Object

Table dont update after changing JS Source Object

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables