How to select multiple checkbox in jquery datatable with pagination? - php

Question

I am using jquery datatables. There I am using check box for each row inside the table. Now I want when a user click select all link which is outside of table, will select all records in the table. For that I am using this function.
function checkAll(formname, checktoggle)
{
var checkboxes = new Array();
checkboxes = document[formname].getElementsByTagName('input');
for (var i=0; i<checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = checktoggle;
}
}
}
Here select all link is
<a onclick="javascript:checkAll('frm_charges', true);" href="javascript:void(0);">Select All</a>
"frm_charges" is the name and id of the form.
This is the code for check box, which I am using inside the table.
<input type="checkbox" value="742" name="charges[]" class="charges" style="opacity: 0; position: absolute; z-index: -1; visibility: hidden;">
Now my problem is I have pagination it is selecting rows from first page but not all page.

Answer 1

Try This:
$(function () {
var oTable = $('#datatable').dataTable();
$('#selectall').click(function () {
var checkall =$('.main_table').find(':checkbox').attr('checked','checked');
$.uniform.update(checkall);
});
});
$(function () {
var oTable = $('#datatable').dataTable();
$('#deselectall').click(function () {
//alert('hi');
var checkall =$('.main_table').find(':checkbox').attr('checked',false);
$.uniform.update(checkall);
});
});

Answer 2

So the problem is your javascript is only getting the checkboxes on the screen. What you need to do is get the checkboxes that are in the original table data. In the following example I get all of the table data, loop through it marking the checkboxes and redraw the data table:
// var oTable - reference to your datatable object
var checkboxColumn = 14; // column number that has the checkboxes in it
function checkAll(checktoggle) {
// get all datatable data
var data = oTable.fnGetData();
// loop through all data
for (var i in data) {
// convert the input into jQuery object
var row = $('<div>' + data[i][checkboxColumn] + '</div>');
// Check the boxes as needed
row.children('input').attr('checked', (checktoggle) ? 'checked' : false);
// update the data in datatables
oTable.fnUpdate(row.html(), parseInt(i, 10), checktoggle, false, false);
}
// redraw the datatable
oTable.fnDraw();
}

Answer 3

You can refer below links and that will give clear functionality idea how to implement
http://datatables.net/examples/api/form.html