描述:
项目要用到批量处理,所以不得不去解决这个一直没解决的问题。
js如下:
{
"mData" : "work_id", //列标识,和服务器返回数据中的属性名称对应
"sTitle" : '<input type="checkbox" id="checkAll">',
"sDefaultContent" : "", //此列默认值为"",以防数据中没有此值,DataTables加载数据的时候报错
"sWidth":"",//定义列宽度,以百分比表示
"render": function ( data, type, row ) {
return '<input type="checkbox" onclick=childclick() class="checkchild" data-oprt="' + row.joborder_operator + '" data-ir="' + row.if_return + '" value="' + data + '">';
}
},
同一函数下处理总开关是否选中相关处理,如下:
$("#checkAll").on('click', function() {
$("tbody input:checkbox").prop("checked", $(this).prop('checked'));
})
childclick()函数写在上面的函数外,不然不生效,如下:
function childclick(){
// 子复选框某个不选择,全选也被取消
// if ($(this).is(":checked") == false) {
// $("#checkAll").prop("checked", false);
// }
// 子复选框某个不选择,全选也被取消
if(!$(".checkchild").checked){
$("#checkAll").prop("checked",false);
}
// 子复选框全选,总复选框也被选中
var sumall =$("input[type='checkbox'][class='checkchild']").length;
var sumchecked =$("input[type='checkbox'][class='checkchild']:checked").length;
if(sumall==sumchecked){
$("#checkAll").prop("checked",true);
}
}
其中的注释部分也能实现子复选框某个不选择,全选被取消
接着是在页面添加一个批量处理的按钮,点击事件:
这里需要说明的是,实际需求是只有坐席号为1111且状态为未闭环的工单才需要批量指派操作,所以把行项目中的坐席号,状态,以及工单都存放在input checkbox的自定义属性和value中,见图一。有了这些数据,就能进行判断了。
//批量指派点击事件
$('#zp').unbind("click").click(function(e){
//获得被选中的行
var sum = $("input[type='checkbox'][class='checkchild']:checked").length;
if(sum>0){//被选中的行大于0继续判断
//声明两个数组,分别存放已选行的坐席号和状态
var oprtArr = new Array();//坐席号数组
var irArr = new Array();//工单状态,是否闭环
$("input[type='checkbox'][class='checkchild']:checked").each(function(){
oprtArr.push($(this).attr('data-oprt'));
irArr.push($(this).attr('data-ir'));
})
//再次遍历两个数组
var flag=1;
for(var e in oprtArr){
//如果已选项中的其中一项的坐席号字段不等于1111,
if(oprtArr[e]!=1111){
flag=0;
break;
}
}
for(var f in irArr){
//如果已选项中的其中一项的状态字段不等于未闭环(即已闭环)
if(irArr[f]!=100102){
flag=0;
break;
}
}
//flag为真说明用户所选的工单都符合坐席号等于1111且等于未闭环状态。
//flag为假说明用户所选的工单不符合,直接返回提醒,让用户自己检查并重新选择
if(flag){
var arr = new Array();
$("input[type='checkbox'][class='checkchild']:checked").each(function(){
arr.push($(this).val());
})
bootbox.confirm("请确认没有重复指派。是否确认指派这"+sum+"条工单?", function(result) {
if(! result) return;
bootbox.prompt("请输入指派对象的DMS账号(大小写不限)", function(rest){
if(! rest) return;
$.ajax({
type: "post",
url: 'plzp',
data:{'arr':arr,'rest':rest},
dataType : "json",
error : function(){
bootbox.alert('操作失败!');
},
success: function(result){
var obj = eval(result);
if(obj.success){
bootbox.alert('指派成功');
oTable.draw(false);
}else{
bootbox.alert(obj.message);
}
}
});
})
});
}else{
bootbox.alert('只能指派受理坐席为1111且未闭环的工单,请检查您的选项');
}
}else{
bootbox.alert('您还没有选择需要指派的工单');
}
});