This question already has an answer here:
How to clear all the checked checkboxes when clicking on the button.
I am using datatable.js to draw a table, where i have checkbox for each row, in the same page i have another div portion when i have my reset button, when i click on the reset button, i expect the check boxes selected in datatable must be cleared. For this i tried various cod snippets but it does not works. My data table id is "example"
HTML dataTable code:
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th></th>
<th>Machine Id</th>
<th>Machine Name</th>
</tr>
</thead>
<tbody style="color: black">
<tr>
<td></td>
<td>1</td>
<td>Tiger Nixon</td>
</tr>
<tr>
<td></td>
<td>1</td>
<td>Garrett Winters</td>
</tr>
</tbody>
</table>
Javascript for dataTable:
$(document).ready(function() {
$('#example').DataTable( {
"lengthMenu": [[15, 20], [15, 20]],
columnDefs: [ {
orderable: false,
className: 'select-checkbox',
targets: 0
} ],
select: {
'style': 'multi',
selector: 'td:first-child'
},
order: [[ 1, 'asc' ]]
} );
} );
$('#example tbody input[type="checkbox"]').prop('checked', false);
$('#example tbody td.select-checkbox').prop('checked', false);
$('.select-checkbox').removeAttr('checked');
$('#example tbody input[type="checkbox"]').removeAttr('checked');
$('#example tbody td.select-checkbox').removeAttr('checked');
// Get all rows with search applied
var rows = $("#example").rows({ 'search': 'applied' }).nodes();
// Check/uncheck checkboxes for all rows in the table
$('input[type="checkbox"]', rows).prop('checked', this.checked);
When a check box is selected, it looks as
<tr role="row" class="even selected">
<td class=" select-checkbox"></td>
<td class="sorting_1">1</td>
<td>Garrett Winters</td>
</tr>
If it is not selected
<tr role="row" class="odd">
<td class=" select-checkbox"></td>
<td class="sorting_1">1</td>
<td>Ashton Cox</td>
</tr>
Aucun commentaire:
Enregistrer un commentaire