Question: Select all checkboxes does not work on next page in JQuery datatables

Question

Select all checkboxes does not work on next page in JQuery datatables

Answers 2
Added at 2016-12-30 13:12
Tags
Question

I am using JQuery datatables. I want to add select all column with checkboxes so that when I click on 'select all' check box all the checkboxes on that page should get selected.

I am using the following code:

<table id="myTable" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th> Name</th>
            <th> Type</th>
            <th> Details</th>
            <th>Select <input type="checkbox" name="select_all" value="1" id="select-all"></th>
        </tr>
    </thead>
    <tbody>
        <?php foreach ($test as $data) { ?>
        <tr>
            <td><?php echo $data->name; ?></td>
            <td><?php echo $data->type; ?></td>
            <td><a href="/details">view details</a></td>
            <td><input type="checkbox" name="manuf[]" class="sub_chk" data-id="<?php echo $data->id; ?>"></td>


        </tr>
        <?php } ?>
    </tbody>
</table>
<script>
$(document).ready(function(){
$('#myTable').DataTable();
});

$('#select-all').on('click', function(e) {
if($(this).is(':checked',true))  
{
    $(".sub_chk").prop('checked', true);  
}  
else  
{  
    $(".sub_chk").prop('checked',false);  
}  
});
</script>

The above code works for the first page of the datatable but if I select the second page and if I select 'Select all' checkbox, it takes me to the first page instead of selecting the checkboxes in the second page.

Is there a solution to this?

Answers
nr: #1 dodano: 2016-12-30 13:12

Working example

The problem comes from the sort, you should disable the sort in the th that contain the select all checkbox.

Hope this helps.

nr: #2 dodano: 2016-12-30 14:12

i hope this link helps you with your problems. thanks

http://www.gyrocode.com/articles/jquery-datatables-how-to-add-a-checkbox-column/

Source Show
◀ Wstecz