DataTable带checkbox


<div id="sjyjSearch" class="modal fade" data-backdrop="static"
		data-keyboard="false" tabindex="-1">
		<div class="modal-content">
			<div class="modal-header modalHeader"
				style="padding-bottom: 0px; border: 0;">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true"></button>
				<div class="portlet box blue"
					style="margin-top: -16px; margin-left: -17px; margin-right: -17px;">
					<div class="portlet-title">
						<div class="caption">
							<h4 id="form_sjyj_title" class="modal-title customTitle">
								<strong>请选择审计依据</strong>
							</h4>
						</div>
					</div>
				</div>
			</div>
			<div class="modal-body">
				<div class="form-group">
					<table id="sjyjTable"
						class='table table-hover table-bordered dataTable no-footer dtr-inline'>
					</table>
				</div>
			</div>
			<div class="modal-footer">
				<button id="btn_sjyj_submit" type="submit" class="btn btn-primary">提交</button>
				<button id="btn_sjyj_cancle" type="submit" data-dismiss="modal"
					class="btn btn-default">取消</button>
			</div>
		</div>
	</div>
var sjyjTable;
var selectedsjyjArr = [];

//审计依据
var sjyjDataTable = function() {
	sjyjTable = $('#sjyjTable').DataTable({
		destroy: true,
		serverSide : true,
		responsive : true,
		processing : true,
		autoWidth : true,// 自动计算列宽
		deferRender : true,// 设置延迟渲染,提高效率用
		draw : false,
		searching: false, 
		bLengthChange: false,
		order : [ 1, 'asc' ],
		ajax : {
			url : "basic/getSjyj",
			type : "POST",
			data : function(d) {
				var sentJson = GET_SENT_JSON(d);
				return sentJson;
			},
			error : function(e) {
				ALERT_ERROR(sjyjTable, e);
			},
		},
		lengthMenu : PAGELENGTH,
		"language" : LANGUAGESETTING,
		columnDefs : [
			{ "targets": 0 ,"name":"fgdm","title": "", "width": "5%", orderable:false,},
			{ "targets": 1 ,"name":"fgdm","title": "法规代码","visible": true,"width": "15%" , orderable :false ,},
			{ "targets": 2 ,"name":"wjh","title": "文件号" ,"visible": true,"width": "15%" , orderable :false ,},
			{ "targets": 3 ,"name":"fgmc","title": "法规名称" ,"visible": true,"width": "65%" , orderable :false ,},
	    ],
	    columns: [
	    	{
  	  	  		"sClass": "text-center",
				"data": "fgmc",
				"render": function (data, type, row, meta) {
					return '<input type="checkbox"  class="checkchild_sjyj"  value="' + data + '"  name="xmlxcheckBox"/>';
				},
			},
	        { data: 'fgdm'},
	        { data: 'wjh' },
	        { data: 'fgmc' },
	    ],
		
		"rowCallback": function( row, data, index ) {
            for(var i = 0 ; i < selectedsjyjArr.length ; i++) {
            	var fgmc = data.fgmc;
            	var wjh = data.wjh;
            	if(fgmc == selectedsjyjArr[i].fgmc && wjh == selectedsjyjArr[i].wjh) {
            		row.children[0].innerHTML =
            			'<input type="checkbox"  class="checkchild_sjyj" checked="true" value="' + fgmc + '"  name="xmlxcheckBox"/>';
            	};
            }
        }
	});
	
	/*
$('#sjyjTable tbody tr').die().live('click',function(){
	var nData = $('#sjyjTable').DataTable().row(this).data()
	if ($(this).find(":checkbox").prop("checked")){  
		$(this).find(":checkbox").removeAttr("checked");  
		var wjh = nData.wjh;
		var fgmc = nData.fgmc;
		for(var m = 0 ; m < selectedsjyjArr.length ; m++) {
			if(fgmc == selectedsjyjArr[m].fgmc && wjh == selectedsjyjArr[m].wjh) {
				selectedsjyjArr.splice(m, 1); 
			}
		}
	}else {  
		$(this).find(":checkbox").prop("checked", true); 
		selectedsjyjArr.push(nData);
	}   
});

双击
$("#sjyjTable tbody tr").live('dblclick',function(e){
		var nData = $('#sjyjTable').DataTable().row(this).data()
	})

*/
	
	
	//鼠标移动添加背景颜色
	mouseEvent("sjyjTable");
	/**
	 * checkBox选择方法
	 */
	sjyjTable.on( 'click', '.checkchild_sjyj',  function (e) {
		var checked = $(this).is(":checked");
		nRow = $(this).parents('tr')[0];
		var nData = sjyjTable.row( nRow ).data()
		if (checked) {
			selectedsjyjArr.push(nData);
		} else {
			var fgmc = nData.fgmc;
			var wjh = nData.wjh;
	 		for(var m = 0 ; m < selectedsjyjArr.length ; m++) {
	 			if(fgmc == selectedsjyjArr[m].fgmc && wjh == selectedsjyjArr[m].wjh) {
	 				selectedsjyjArr.splice(m, 1); 
	 			}
	 		}
		}
		
	});
}

//按钮点击处理
var handleBtnClicksjyjCom = function(){
	//审计依据事件
	$("#btn_sjyj").on('click', function() {
		//修改时回显已选中的审计依据
		var aArr = $("#sjyj_div a");
		if(aArr.length == 0){
			selectedsjyjArr = [];
		}
		for(var i = 0; i<aArr.length; i++){
			var content = aArr[i].innerHTML;
			var contentArr = content.split("]");
			var wjh = contentArr[0].substring(1,contentArr[0].length);
			var fgmc = contentArr[1];
			var sle = {wjh:wjh,fgmc:fgmc};
			if(selectedsjyjArr.length != 0){
				var msg;
				for(var j = 0; j<selectedsjyjArr.length; j++){
					if(selectedsjyjArr[j].wjh == wjh){
						msg = 1;
					}
				}
				if(msg != 1){
					selectedsjyjArr.push(sle);
				}
			}else{
				selectedsjyjArr.push(sle);
			}
		}
		
		$("#sjyjSearch").modal('show');
		sjyjTable.ajax.reload();
		return false;
    });
	
	//审计依据提交
	$('#btn_sjyj_submit').on('click', function() {
		//删除内容
		$("#sjyj_div").empty();
//		selectedsjyj = $(".checkchild_sjyj:checked");
		//将选中审计依据添加到界面
		
    	var Table = document.createElement('table');
		for(var i=0;i<selectedsjyjArr.length;i+=2){
    		var lRow = document.createElement('tr');
    		
			Table.appendChild(lRow);
			for(var j = 0;j<2;j++){
				var content = '';
				if((i+j) < selectedsjyjArr.length){
					content = (i+j+1)+". "+"<a class='documentOpen' type='application/msword' style='line-height:25px;'>"+"["+selectedsjyjArr[i+j].wjh+"]"+selectedsjyjArr[i+j].fgmc+"</a><br/>";
				}
				var lLine = document.createElement('td');
				lLine.innerHTML = content;
				lRow.appendChild(lLine);
			}
		}
		$("#sjyj_div").append(Table);
		$("#sjyjSearch").modal('hide');
		return false;
    });
	
}


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM