How can I change data array in DataTables after initialization

Question

I have a table, which gets dataform Javascript array. After the array gets changed, I want to change the data shown in the table without recreating it again. I start the table with

$('#table').dataTable( {
                    "bPaginate": false,
                    "data": dataArray,
                    "columns": [
                        { "title": "....

Later on I will add one more record to dataArray, but want to preserve all the sorting, filters,... How do I redraw table with new contents of the dataArray?

Control Freak · Accepted Answer · 2014-09-15 15:28:38Z

1

You need to reload the data to your datatable
You need to redraw the table

You need to put all this code in your fnInitComplete function.

Like this:

$(document).ready( function() {
  $('#example').dataTable( {
    "fnInitComplete": function(oSettings, json) {
      alert( 'DataTables has finished its initialisation.' );
      if(...){
        //load the new array
        oSettings.aoData = newArray;          
        //redraw the table
        $(this).fnDraw();
      }
    }
  } );
} )

edited Sep 15, 2014 at 15:28

answered Sep 15, 2014 at 15:18

Control Freak

13.2k31 gold badges101 silver badges150 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Birgit Martinelle · Accepted Answer · 2014-09-15 15:40:21Z

1

If you are looking to add a new Row to your table you can take advantage of the add row API

  var table  = $("#table").DataTable();
  t.row.add( [
            "col 1 value" ,
            "col 2 value",
            ...
            "col 5 value"
        ] ).draw();

http://www.datatables.net/examples/api/add_row.html

answered Sep 15, 2014 at 15:40

Birgit Martinelle

1,8991 gold badge12 silver badges9 bronze badges

Collectives™ on Stack Overflow

How can I change data array in DataTables after initialization

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related