jQuery 如何从dataTable行集合中获取复选框输入值?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18684703/
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 get check box input value from dataTable row collection?
提问by D W Langham
I have a table that serves as a jquery dataTable. Each data row has a check box column. Visitors to the page will click the check boxes to select which items to delete. The dataTable has pagination and filtering enabled, so a visitor may select one or more check boxes on different pages. When the user clicks "delete", I want to be able to grab the value of each selected check box.
我有一个用作 jquery 数据表的表。每个数据行都有一个复选框列。该页面的访问者将单击复选框以选择要删除的项目。数据表启用了分页和过滤功能,因此访问者可以在不同页面上选择一个或多个复选框。当用户单击“删除”时,我希望能够获取每个选定复选框的值。
I figured out how to get the checked rows as a collection using this: var rowcollection = oTable.$(".call-checkbox:checked", {"page": "all"});
What I haven't figured out is how to iterate through the collection to grab the value of each row's check box input.
我想出了如何使用此将选中的行作为集合获取:var rowcollection = oTable.$(".call-checkbox:checked", {"page": "all"});
我还没有想出如何遍历集合以获取每行复选框输入的值。
Below is the script and the table. Please tell me I'm missing something incredibly obvious.
下面是脚本和表格。请告诉我我遗漏了一些非常明显的东西。
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$('#calltable').dataTable({
"bPaginate": true,
"bLengthChange": true,
"bFilter": true,
"bSort": true,
"bInfo": true,
"bAutoWidth": true,
"bStateSave": true,
"aoColumnDefs": [
{ 'bSortable': false, 'aTargets': [ -1,0] }
]
});
// trashcan is the id of the icon users click to delete items
// onclick get all the checked rows and do something
$("#trashcan")
.click(function () {
var oTable = $('#calltable').dataTable();
var rowcollection = oTable.$(".call-checkbox:checked", {"page": "all"});
for(var i = 0; i < rowcollection.length; i++)
{
// GET THE VALUE OF THE CHECK BOX (HOW?) AND DO SOMETHING WITH IT.
//
}
});
});
</script>
<table id="calltable" class="pretty">
<thead>
<tr>
<th><span id="check">Check</span> |
<span id="uncheck">U</span> |
<img src="/trash_16x16.gif" alt="Delete" id="trashcan" />
</th>
<th>phone</th>
<th>name</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" class="call-checkbox" value="22" />
</td>
<td>8438740903</td>
<td>Susan</td>
<td>S</td>
</tr>
<tr>
<td>
<input type="checkbox" class="call-checkbox" value="23" />
</td>
<td>9098983456</td>
<td>Hyman Sparrow</td>
<td>S</td>
</tr>
</tbody>
</table>
回答by Raúl Juárez
Use the each
function, instead of the for loop like this:
使用该each
函数,而不是像这样的 for 循环:
var oTable = $('#calltable').dataTable();
var rowcollection = oTable.$(".call-checkbox:checked", {"page": "all"});
rowcollection.each(function(index,elem){
var checkbox_value = $(elem).val();
//Do something with 'checkbox_value'
});
回答by babun
This is dynamically added checkbox to jquery dataTable.And You will get checked checkbox value.
这是动态添加到 jquery 数据表的复选框。您将获得选中的复选框值。
var table = $('#tblItems').DataTable({});
Example:
例子:
$(document).on('click', '#btnPrint', function () {
var matches = [];
var checkedcollection = table.$(".chkAccId:checked", { "page": "all" });
checkedcollection.each(function (index, elem) {
matches.push($(elem).val());
});
var AccountsJsonString = JSON.stringify(matches);
//console.log(AccountsJsonString);
alert(AccountsJsonString);
});