如何解决使用数据表选择多页记录
有这样的要求,我需要选择不同页面的数据表中的记录,例如第一页 2 记录,第二页 3 记录...我只能选择第一页,如果我更改为第二页并选择记录,以前选定的记录正在重置和更新新数据。我尝试了下面的代码,如果有任何问题,请帮助..
$("#firstTable input:checked").each(function() {
if (info.index != "") {
creditAmount += parseInt($(this).prop("value"));
}
});
$("#idCheckBoxLabel").text(creditAmount);
}
解决方法
要处理 DataTable 中的所有行,考虑到分页,您不能使用 DOM 和 jQuery 选择器。 DOM 中唯一可见的值将是当前显示页面中的值 - 如您所见。
相反,您必须通过 DataTables API 访问表的数据。这将使您可以访问存储在 DataTable 中的整个数据集,无论它是否在当前页面上(而且,它可以考虑过滤)。
这是我的“最小可重现示例”演示表,使用您的数据:
$(document).ready(function() {
var table = $('#example').DataTable( {
ajax: {
url: "https://raw.githubusercontent.com/l-lin/angular-datatables/master/demo/src/data/data.json",},columns: [
{ title: "",defaultContent: '<input type="checkbox" />' },{ title: "Amount",data: "id" },{ title: "First Name",data: "firstName" },{ title: "Last Name",data: "lastName" }
]
} );
} );
然后我定义一个函数如下:
function doSum() {
var table = $('#example').DataTable();
var checkboxNodes = table.column(0).nodes();
var amountData = table.column(1).data();
var sum = 0;
for (var i = 0; i < checkboxNodes.length; i++) {
if( $(checkboxNodes[i]).find("input").is(':checked') ) {
sum += amountData[i];
}
}
console.log(sum);
}
此功能附加到一个按钮上,用于测试:
<button onclick="doSum()">Test</button>
这里的关键部分是 DataTables API 调用:
table.column(0).nodes()
和
table.column(1).data()
使用每个节点,然后我可以使用 jQuery 选择器访问每个复选框的状态 - 并获得总和的相关金额。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。