How to get data from all selected rows in datatable? - datatables

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 !

Answer 1

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();
});
}

Answer 2

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');
});
});