easyUI datagrid实现反选功能

最新推荐文章于 2022-03-29 09:09:07 发布

寒江钓翁

最新推荐文章于 2022-03-29 09:09:07 发布

阅读量3.8k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/dbh58/article/details/9448923

本文介绍了如何使用JavaScript实现用户列表的批量操作功能，包括全选、反选、添加等功能，涉及用户权限管理的实现细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JS 代码

$("#roleUserList").datagrid({

checkbox :true,
fitColumns:true,
idField:'uid',
toolbar : [ {
text : '全选',
handler : function() {
$("#roleUserList").datagrid("selectAll");
}
}, '-', {
text : '反选',
handler : function() {
var pageRow = $("#roleUserList").datagrid("getRows")
var selecRow = $("#roleUserList").datagrid("getSelections")
var pageRowSize = pageRow.length;
var selecRowSize = selecRow.length;
var mycars = new Array();
for(var i=0;i<pageRowSize;i++){
var tempArray = new Array();
//便利页面数据，和选中的数据做比较。
for(var j=0;j<selecRowSize;j++){
//如果找到被选中数据直接跳出。否则，将参与比较的选中数据放入数组。
if(pageRow[i]==selecRow[j]){
break;
}else{
tempArray[tempArray.length]= selecRow[j];
}
}
//如果参与比较并且比较结果不同，说明该数据未被选中。如数组中备用！
if(tempArray.length==selecRowSize){
mycars[mycars.length] = pageRow[i];
}
}
$("#roleUserList").datagrid("clearSelections");

var mylen = mycars.length;
for(var ind=0;ind<mylen;ind++){
$("#roleUserList").datagrid("selectRecord",mycars[ind].uid);
}
}
},'-', {
text : '取消',
handler : function() {
$("#roleUserList").datagrid("clearSelections");
}
},'-', {
text : '添加',
iconCls : 'icon-add',
handler : function() {
var orgName = $("#orgName").val();
var userList = $("#roleUserList").datagrid("getSelections")
var uids = new Array();
for(var i=0;i<userList.length;i++){
uids[i] = userList[i].uid;
}
$.ajax({
type:'post',
url:'authoritiesManagerAction!addUserToOrg.do',
dataType:"json",
data:{
"uids":uids,
"orgName":orgName
},
sussecc:function(){
alert("功能开发中。。。。。。");
}
});
}
}],
columns:[[
{field :'checkbox',title:'选择',checkbox :true, width:40},
{field:'uid',title:'账号',width:100},
{field:'cn',title:'姓名',width:100}
]]
});