Datatable problem with Select All and Get Data Select All
Datatable problem with Select All and Get Data Select All
Invincible1
Posts: 6Questions: 2Answers: 0
Hello everybody,
Sorry for english
For the past few days, I have been facing some issues with Datatable. In my script, I want to be able to select all the rows in my table (not just those present on the DOM) when I click on the checkbox in the header of my table.
However, it is only the lines in the DOM that are selected.
And also I wish to be able to recover all the data of the selected lines when I click on the checkbox of the header.
Here is my script:
$(document).ready(function () {
var rows_selected = [];
var tableChildRows = $('#dt-fact').DataTable({
processing: true,
serverSide: true,
ajax: {
url: "{!! route('fact.indexed') !!}",
data: function (d) {
d.datedeb = $('input[name=datedeb]').val();
d.datefin = $('input[name=datefin]').val();
d.ssvg = $('select[name=ss]').val();
},
},
columnDefs: [{
orderable: false,
className: 'select-checkbox',
targets: 0,
}],
select: {
style: 'multi',
selector: 'td:first-child',
},
order: [[1, 'asc']],
rowCallback: function(row, data, dataIndex) {
var rowId = data.DT_RowId;
if($.inArray(rowId, rows_selected) !== -1) {
$(row).addClass('selected');
}
},
columns: [
{ orderable: false, data: null, defaultContent: '', searchable: false },
{ class: "details-control", orderable: false, data: "", defaultContent: "", searchable: false },
{ data: 'DT_RowData.data-scrpteur.nom', name: 'player.nom', class: 'font-18' },
{ data: 'DT_RowData.data-num', name: 'player.num' },
{ data: 'DT_RowData.data-dat', name: 'player.dat', orderable: true },
{ data: 'DT_RowData.data-ech', name: 'player.ech', orderable: true },
{ data: 'DT_RowData.data-prime', name: 'player.prime', orderable: true },
{ data: 'DT_RowData.data-player.svg.ssnom', name: 'player.svg.ssnom', class: "text-left" },
],
});
$('.dt-fact tbody').on('click', 'tr td.select-checkbox', function(e) {
var $row = $(this).closest('tr');
var data = tableChildRows.row($row).data();
var rowId = data.DT_RowId;
var index = $.inArray(rowId, rows_selected);
if(index === -1) {
rows_selected.push(rowId);
$row.addClass('selected');
} else {
rows_selected.splice(index, 1);
if($row.hasClass('selected')) { $row.removeClass('selected'); }
}
});
$('thead input[name="select_all"]', tableChildRows.table().container()).on('click', function(e) {
if(this.checked) {
$('.dt-fact tbody tr').addClass('selected');
} else {
$('.dt-fact tbody tr').removeClass('selected');
rows_selected = [];
}
e.stopPropagation();
});
This discussion has been closed.