天天看點

解決DataTables 使用FixedColumns固定列以後checkbox複選框無法使用的問題

導入外部包

<link rel="stylesheet" href="http://cdn.datatables.net/fixedcolumns/3.3.2/css/fixedColumns.bootstrap.css" type="text/css"></link>
	<script type="text/javascript" src="http://cdn.datatables.net/fixedcolumns/3.3.2/js/dataTables.fixedColumns.min.js"></script>
	<script type="text/javascript" src="http://cdn.datatables.net/fixedcolumns/3.3.2/js/fixedColumns.bootstrap.js"></script>
	
           

關鍵代碼

new $.fn.dataTable.FixedColumns(table,{
					 "iLeftColumns":4,
					 "drawCallback": function(){
						 
						 $("table thead").find(":checkbox").on("click",function(){
							   	if($(this).is(':checked')){
							   		$("table tbody").find(":checkbox").prop("checked",true); 
							   	}else{
							   		$("table tbody").find(":checkbox").prop("checked",false); 
							   	}
						});
						 
						 $("table tbody").find(":checkbox").on("click",function(){
							 
								   	if($(this).is(':checked')){
								   		$('table tbody input[id="'+$(this).attr("id")+'"]').prop("checked",true); 
								   	}else{
								   		$('table tbody input[id="'+$(this).attr("id")+'"]').prop("checked",false); 
								   	}
								   	
							   });
					    }
					});
           

其實就是手動給tbody和thead 添加點選事件