select all checkboxes does not work on next page in jquery datatables

I am using jquery datatables. I want to add select all column with checkboxes. So 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.

How can I fix this..