javascript 如何使用分页在jquery数据表中选择多个复选框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16980477/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to select multiple checkbox in jquery datatable with pagination?
提问by Amar Banerjee
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.
我正在使用 jquery 数据表。在那里，我为表格内的每一行使用了复选框。现在我想当用户单击选择表外的所有链接时，将选择表中的所有记录。为此，我正在使用此功能。
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.
“frm_charges”是表单的名称和 ID。
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.
现在我的问题是我有分页，它从第一页而不是所有页面中选择行。
采纳答案by Moumita
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);
});
});
回答by chrislondon
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:
所以问题是您的 javascript 只获取屏幕上的复选框。您需要做的是获取原始表数据中的复选框。在以下示例中，我获取所有表数据，循环遍历它标记复选框并重绘数据表：
// 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();
}
回答by Anil Gupta
You can refer below links and that will give clear functionality idea how to implement
您可以参考以下链接，这将提供清晰的功能概念如何实现
http://datatables.net/examples/api/form.html
