Werner
Werner

Reputation: 801

How to delete a row from a Datatable

I am trying to delete a row from a table if 3 values match but am having some issues.

What I have is the following:

$(function () {
  $('#st').DataTable({
    "paging": false,
    "lengthChange": false,
    "searching": false,
    "ordering": true,
    "info": false,
    "autoWidth": true,
    "order": [[ 0, "asc" ]],
    "createdRow": function ( row, data, index ) {
      if ( data[1] == data[2] && data[2] == data[3] ) {
              $(row).addClass('table-success');
              $(row).remove();
          }
      }
    });
});

It colors the row correctly (I added that to test the logic), but it is not deleting the row. I have tried a few different answers from the docs, but they all fail. The above fails silently, which does not help.

According to the docs, I also tried the following:

var table = $('#st').DataTable({

and then tried to delete as follow:

table.row($(row)).remove();

This fails with jquery.min.js:2 Uncaught TypeError: Cannot read property 'row' of undefined

The table rows are created as follow:

              <?php
                foreach ($vfile as $key => $value) {
                  if (empty($value['latest_version'])) { continue; }
              ?>
                <tr>
                  <td> <?php echo $value['module']; ?> </td>
                  <td> <?php echo $value['latest_version']; ?> </td>
                  <?php foreach ($st_envs as $k => $v) { 
                    $vrs = !empty($value[$v]) ? $value[$v] : 'Not Included';
                    echo "<td>" . $vrs  . "</td>";
                  }
                  ?>
                </tr>
              <?php } ?>

I am pretty new to JS and the works, so am a little lost as to where to start - any ideas?

Upvotes: 1

Views: 734

Answers (1)

davidkonrad
davidkonrad

Reputation: 85528

You get "Cannot read property 'row' of undefined" because table not is initialised. The Api is simply not yet passed back to the variable reference at the time createdRow is executed.

But inside DT's callbacks you always have this, which actually is the dataTable (jQuery) instance of the DataTable API. So

createdRow: function ( row, data, index ) {
  if ( data[1] == data[2] && data[2] == data[3] ) {
    $(row).addClass('table-success')
    this.api().row(row).remove() //<-----
  }
}

Upvotes: 1

Related Questions