jQuery 系统授权
前些天做了一个利用Jquery做了一个系统授权的东东，个人感觉不错，主要是感觉代码很精简，留个纪念吧，公司有规定，我只截了一部分吧的图片，看图直观啊
上代码：
jsp页面代码：
<div id="listRolePermission">
<c:forEach var="item" items="${result.map.items}">
<div class="dialogPermissionContent">
<input type="checkbox" class="permission_grandpa" <c:if test="${item['selected'] eq 'selected' }">checked="checked"</c:if> />${item['key']}
<c:forEach items="${item['list']}" var="permission">
<div class="permissionFather">
<input type="checkbox" class="permission_father"<c:if test="${permission.selected eq 'selected' }">checked="checked"</c:if> />${permission.name}
<div class="permissionSon">
<c:forEach items="${permission['list']}" var="permissionItem">
<input type="checkbox" class="permission_son" value="${permissionItem.permissionId}" <c:if test="${permissionItem.selected eq 'selected' }">checked="checked"</c:if> />${permissionItem.label}
</c:forEach>
</div>
</div>
</c:forEach>
</div>
</c:forEach>
</div>
js代码：//这里不难，在这里真真感觉到了jQuery的强大啊，尤其是那选择器，太NX了
$("#listRolePermission").find("input").each(function(){
if($(this).attr("checked") == true){
$(this).addClass("select");
$(this).parentsUntil("#listRolePermission").find(".permission_grandpa").attr("checked",true);
}
});
$(".permissionFather").children().find("input").each(function(){
if($(this).attr("checked") == true){
$(this).addClass("select");
$(this).parentsUntil(".permissionFather").parent().children("input").attr("checked",true);
}
});
$(".permission_grandpa").live("click",function() {
var flag = $(this).attr("checked");
$(this).parent().children().find("input").each(function() {
$(this).attr("checked", flag);
if(flag){$(this).addClass("select");}else{ $(this).removeClass("select");}
});
});
$(".permission_father").live("click",function() {
var flag = $(this).attr("checked");
var $grandpa = $(this).parent().parent();
$(this).parent().children().find("input").each(function() {
$(this).attr("checked", flag);
if(flag){$(this).addClass("select");}else{ $(this).removeClass("select");}
});
$(this).siblings().find("input").attr("checked", flag);
$grandpa.children("input").attr("checked", flag);
if(!flag){
if($grandpa.children("div").find("input").hasClass("select")){
$grandpa.children("input").attr("checked", !flag);
}else{
$grandpa.children("input").attr("checked", flag);
}
}
});
$(".permission_son").live("click",function() {
var flag = $(this).attr("checked");
var $father = $(this).parent().siblings("input");
$(this).attr("checked", flag);
$father.attr("checked", flag);
if(flag){$(this).addClass("select"); }else{ $(this).removeClass("select");}
if(!flag){
if(!$(this).siblings().hasClass("select")){
$father.attr("checked", flag);
$father.removeClass("select");
$("#listRolePermission").find("input").each(function(){
if($(this).attr("checked") == flag){
$(this).removeClass("select");
$(this).parentsUntil("#listRolePermission").find(".permission_grandpa").attr("checked",flag);
}
});
}else{
$father.attr("checked", !flag);
$father.addClass("select");
}
}else{
$father.addClass("select");
}
$("#listRolePermission").find("input").each(function(){
if($(this).attr("checked") == true){
$(this).addClass("select");
$(this).parentsUntil("#listRolePermission").find(".permission_grandpa").attr("checked",true);
}
});
});
后台处理代码：
@RequestMapping(params="action=permission")
public ModelAndView permission(HttpServletRequest request) throws Exception {
ModelAndView mav = new ModelAndView(PageView.SYSTEM_ROLE_PERMISSION);
QueryCondition conds = new QueryCondition(new Pager());
DataResult dataResult = new DataResult();
conds.getPager().setPageSize(conds.getPager().getTotalCount());
QueryCondition configConds = new QueryCondition();
DataModelList alllist = roleService.findPermission(configConds);
List<PermissionVO> allListP = alllist.getList();
List<PermissionVO> listSelected =null;
String roleIdString = request.getParameter("roleId");
if(UtilValidate.isNotEmpty(roleIdString)){
QueryCondition selectedConds=new QueryCondition();
selectedConds.put("roleId",roleIdString);
listSelected = roleService.findRolePermission(selectedConds).getList();
dataResult.addObject("roleId",roleIdString);
}
List list = new ArrayList();
//这一块处理的好啊，吴大哥就是厉害啊，就应为这个Map使jsp界面很简洁，很优雅。第一回感觉到map的强大啊
Map<String,String> mapType = new HashMap<String,String>();
mapType.put("系统", "system_");
mapType.put( "***","user_");
mapType.put("---", "club_");
//初始化时，判断是否选中
for(int k=0;k<listSelected.size();k++){
for(int i=0;i<allListP.size();i++){
if(listSelected.get(k).getPermissionId() == allListP.get(i).getPermissionId()){
allListP.get(i).setSelected("selected");
}
}
}
for(Map.Entry<String,String> m: mapType.entrySet()){
Map map = new HashMap();
List itemList = new ArrayList();
for(int i=0;i<allListP.size();i++){
PermissionVO permissionVO=allListP.get(i);
if(UtilValidate.isNotEmpty(permissionVO.getCode()) && permissionVO.getCode().indexOf(m.getValue().toString())==0){
checkPermission(itemList,permissionVO,listSelected);
}
}
map.put("key",m.getKey().toString());
map.put("list", itemList);
list.add(map);
}
dataResult.addObject("items",list);
mav.addObject("result", dataResult);
return mav;
}
//因为里面套着2个层，所以还得有两个list
private boolean checkPermission(List itemList,PermissionVO permissionVO,List<PermissionVO> listSelected){ boolean check = false; List<PermissionVO> perList = null; for(int i=0;i<itemList.size();i++){ Map perMap = (Map) itemList.get(i); perList = (List) perMap.get("list"); if(UtilValidate.isNotEmpty(perList)){ if(permissionVO.getPermissionUnion().equals(((PermissionVO)perList.get(0)).getPermissionUnion())){ check = true; if(!checkPermissionItem(perList,permissionVO)){ perList.add(permissionVO); } } } } if(!check){ perList = new ArrayList(); perList.add(permissionVO); Map perMap = new HashMap(); perMap.put("list", perList); perMap.put("key", permissionVO.getPermissionUnion()); perMap.put("name", permissionVO.getPermissionUnionName()); perMap.put("id", permissionVO.getPermissionId()); itemList.add(perMap); } return check; } private boolean checkPermissionItem(List<PermissionVO> itemList,PermissionVO permissionVO ){ for(int i=0;i<itemList.size();i++){ PermissionVO itemPermissionVO = (PermissionVO)itemList.get(i); if(permissionVO.getCode().equals(itemPermissionVO.getCode())){ return true; } } return false; }