js在datatables中运用checkbox


在运用datatable时,经常要在td中嵌入checkbox,但是如果datatable有翻页时,页面可能读不到翻页后的checkbox,例如有个全选的勾选框,需要全选时,如果使用

$('.content-box .select-all').click(function() {
if ($(this).is(':checked'))

 $(':checkbox').attr('checked', true);
else 

$(':checkbox').attr('checked', false);
});

只能勾选当前页的所有checkbox,其他页的表格checkbox依然是不能勾选的。



现在的一个解决方法是读取datatable的长度,并更新checkbox

$('.content-box .select-all').click(function() {

var tableSetings=$('#testtable').dataTable().fnSettings();

for(var i=0;i<tableSetings.aiDisplay.length;i++){
if ($(this).is(':checked')){
$('#testtable').dataTable().fnUpdate( '<input type="checkbox" checked>' ,i, 0,false );
}else{
$('#testtable').dataTable().fnUpdate( '<input type="checkbox" >' , i, 0 ,false);
}
}



});

要擅长运用$('#testtable').dataTable().fnSettings()这个对象,里面有许多我们需要的信息。


-----------------------------------------------------------------------------------------------------------------------------------------------

以上所说的是如何全选checkbox,下面要介绍如何读取所有被选中的行数据(包括不在当前页的行数据)


一种方法是加入一个隐藏列来标识该行有没有被选中,用delegate监听checkbox的click事件,当有click事件时,改变相应行在隐藏列里面的数值(0和1或者其他标识),当js要读取被勾选的行时就可以直接用fnfliter过滤出隐藏列中标识为1(或者其他)的行数据。(这是相对于旧版本的datatable的api而言)


以上是学习过程中的经验总结,菜鸟一个。。。求别喷。。

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值