How to get data from all selected rows in datatable?

Question

I have a simple table :

<div class="col-md-12 top-buffer">
    <table id="table-data" class="table table-striped table-bordered">
        <thead>
        <tr>
            <th></th>
            <th>Code</th>
            <th>Name</th>
            <th>Postal Code</th>
            <th>City</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>

I implemented the selection of multiple rows using this :

var rows_data = [];
$(document).ready(function () {
    $('#table-data tbody').on('click', 'input[type="checkbox"]', function(e) {
        var $row = $(this).closest('tr');
        if(this.checked){
            $row.addClass('selected');
        } else {
            $row.removeClass('selected');
        }

        e.stopPropagation();
    });

    $('#table-data').on('click', 'tbody td, thead th:first-child', function(e) {
        $(this).parent().find('input[type="checkbox"]').trigger('click');
    });
}

What I'd like to do is add/remove the data of a row in rows_data[] when I select/deselect one.

How should I do to access the data (and also the index) of a row ?

Thanks !

This question has been asked multiple times and have accepted answers [**here**](http://stackoverflow.com/questions/32138984/datatable-easy-way-to-get-all-selected-rows-in-jquery), [**here**](http://stackoverflow.com/questions/29191760/jquery-datatables-getting-selected-row-values), [**here**](http://stackoverflow.com/questions/33494758/jquery-data-tables-get-data-from-selected-rows) and [**here**](http://stackoverflow.com/questions/32307818/get-selected-rows-first-column-value-in-datatable) - just to mention a few, — davidkonrad, Feb 04 '16 at 15:29

score 1 · Accepted Answer · answered Feb 04 '16 at 14:06

Well I found something quite simple, here it is :

var rows_selected = [];
var table = $('#table-data').DataTable();
$(document).ready(function () {
    $('#table-data tbody').on('click', 'input[type="checkbox"]', function(e) {
        var $row = $(this).closest('tr');

        var data = table.row($row).data();
        var key = data[1];

        if(this.checked){
            $row.addClass('selected');
            rows_selected[key] = data;
        } else {
            $row.removeClass('selected');
            delete rows_selected[key];
        }

        e.stopPropagation();
    });
}

score 0 · Answer 2 · answered Feb 04 '16 at 14:22

Alternatively, you can clear and rebuild your rows_data array with a little less code:

var rows_data = [];

$(function() {
  var table = $('#table-data').DataTable();
  $('#table-data tbody').on('click', 'input[type="checkbox"]', function(e) {

    var $row = $(this).closest('tr');
    if (this.checked) {
      $row.addClass('selected');
    } else {
      $row.removeClass('selected');
    }

    rows_data = [];

    $('#table-data tr.selected').each(function() {
      rows_data.push(table.row($(this)).data());
    });

    e.stopPropagation();
  });

  $('#table-data').on('click', 'tbody td, thead th:first-child', function(e) {
    $(this).parent().find('input[type="checkbox"]').trigger('click');
  });
});

How to get data from all selected rows in datatable?

2 Answers2