title: Jquery datatable reload with local data
body: <p>I'm using <a href="http://datatables.net/" rel="nofollow">datatable</a> plugin as grid to populate data. i have maintain local object array to temperately add data </p>
  
  <pre><code>var tableSetup = [];
  </code></pre>
  
  <p>i can bind the data to datatable like this</p>
  
  <pre><code>var datatableTabletools = undefined;
  var tableSetupGrid = $('#facility-setup').DataTable({
      searching: false,
      ordering: false,
      scrollY: "300px",
      scrollCollapse: true,
      paging: false,
      info: false,
      preDrawCallback: () =&gt; {
          if (!datatableTabletools) {
              datatableTabletools = new ResponsiveDatatablesHelper($('#facility-setup'), datatableTabletools);
          }
      },
      rowCallback: (nRow) =&gt; { datatableTabletools.createExpandIcon(nRow); },
      drawCallback: (oSettings) =&gt; { datatableTabletools.respond(); },
      data: tableSetup,
  
      columns: [
          { data: "nooftables" },
          { data: "noofchairspertable" },
          { data: "noofblocks" },
          { data: "noofrows" },
          { data: "noofcolumns" },
          { data: "color" },
          { data: null }
      ],
      columnDefs: [
          {
              targets: 6,
              render: (data, type, row) =&gt; {
                  var btnschedule = ' &lt;button class=\'btn btn-xs btn-default\' data-toggle=\'modal\'  data-button-id="0"&gt;&lt;i class=\'fa fa-calendar\'&gt;&lt;/i&gt; Schedule&lt;/button&gt;';
                  var btnEdit = ' &lt;button class=\'btn btn-xs btn-default\' data-toggle=\'modal\'  data-button-id="1" data-original-title=\'Edit Row\'&gt;&lt;i class=\'fa fa-pencil\'&gt;&lt;/i&gt; Edit&lt;/button&gt;';
                  return btnEdit + ' ' + btnschedule;
              }
          }
      ]
  
  });
  </code></pre>
  
  <p>problem is when i add data to array datatable not reload with newly added data 
  i tried with below code</p>
  
  <pre><code>tableSetupGrid.row.add({ nooftables: 1, noofchairspertable: 2, noofblocks: 3, noofrows: 4, noofcolumns: 5, color: 6 });
  tableSetupGrid.rows().invalidate().draw()
  </code></pre>
  
  <p>what was the problem with my code</p>
  
  <p>regards</p>