ZTree + JQuery +Struts2 +SSH框架
做到一个用户角色权限配置的模块，上网找了找发现ZTree不错，于是研究啦一下，现在是凌晨，感觉效果出来了，就先发个帖子，记下来!
首先是在jsp页面导入 jQuery 和 ZTree 相关的外置文件
这可以在我的实例代码中找到
其中在去往权限树页面时无法正常通过struts 传递参数，所以用了笨的方法就是在小脚本内
int roId = (Integer.parseInt(request.getParameter("roId"))) 获得角色ID 然后传参给action 按照 角色查询已分配权限，这样就可以把已分配的权限 chec 设置为true,这个写在了Action 方法内。
下面是jsp的代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
int roId = (Integer.parseInt(request.getParameter("roId"))); //从上一个页面传过来用户ID
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>角色权限配置页面</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<META content="MSHTML 6.00.2900.5848" name=GENERATOR>
<link type="text/css" rel="stylesheet" href="<%=path%>/css/css.css" />
<link rel="stylesheet"
href="<%=path%>/js/JQuery zTree v3.3/css/demo.css" type="text/css" />
<link rel="stylesheet"
href="<%=path%>/js/JQuery zTree v3.3/css/zTreeStyle/zTreeStyle.css"
type="text/css" />
<script type="text/javascript" src="<%=path%>/js/jquery-1.9.0.js"></script>
<script type="text/javascript"
src="<%=path%>/js/JQuery zTree v3.3/js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript"
src="<%=path%>/js/JQuery zTree v3.3/js/jquery.ztree.excheck-3.5.js">
</script>
<script type="text/javascript">
var zTreeObj;
var setting = {
check : {
enable : true
},
data : {
simpleData : {
enable : true
}
}
};
$(document).ready(function() {
//var tt ='<%=roId%>';
// alert(tt);
var roId = '<%=roId%>';
alert(roId);
var url = '<%=path%>/searchRightTree.action?roId=' + roId;
alert('url:' + url);
$.ajax( {
url : url,
type : "get",
dataType : "json",
success : initZtree
});
});
function initZtree(json) {
alert('json' + json);
// var data = (json.permString);
// alert('data'+data);
var zNodes = eval("(" + json + ")");
zTreeObj = $.fn.zTree.init($('#kpiTree'), setting, zNodes);
}
function submitCheckedNodes(treeNode) {
var nodes = new Array();
//取得选中的结点
nodes = zTreeObj.getCheckedNodes(true);
var str = "";
for (i = 0; i < nodes.length; i++) {
if (str != "") {
str += ",";
}
str += nodes[i].id;
}
alert(str);
var rightsId = str;
var roId = $("#roId").val();
var roId = $("#rightsId").attr("value", rightsId);
;
var roId = $("#rightsId").val();
alert("页面隐藏id:" + roId + "__ rightsId:" + rightsId);
$("form:first").submit();
}
</script>
</HEAD>
<BODY
style="BACKGROUND-POSITION-Y: -120px; BACKGROUND-IMAGE: url('<%=path%>/images/bg.gif'); BACKGROUND-REPEAT: repeat-x"
onload="init();">
<DIV style="height: 200%">
<br>
选择权限
<hr color="red">
<form action="<%=path%>/addRiToRo_role.action" name="checkForm"
method="post">
<div>
<ul id="kpiTree" class="ztree"></ul>
</div>
<input type="hidden" name="roId" value="<%=roId%>" id="roId" />
<input type="hidden" name="rightsId" id="rightsId" />
<input type="button" value="提交" onclick="submitCheckedNodes()" />
</form>
</DIV>
</BODY>
</HTML>
接下来是Action 内的代码
public class RolesAction extends ActionSupport {
// Int
private int roId; //存放角色ID
// String []
private String [] rightsId; //存放权限ID数组
// String
private String permString ;
并选中
for (TRights tRi : alist) {
if(tRi.getRightId().equals(ri.getRightId())){
sb.append("\",checked:\"");
sb.append(true);
}
}
}
sb.append("\"}");
if (size > 0) {
sb.append(",");
}
}
sb.append("]");
this.permString = sb.toString();
System.out.println("获得的json字符串为："+this.permString);
} catch (Exception e) {
e.printStackTrace();
}
return SUCCESS;
}
// 为角色添加权限(删除原先中间表信息，添加新的中间表信息)
public String addRiToRo(){
System.out.println("获得权限ID数组大小："+rightsId.length);
rightsId=rightsId[0].split(",");
for (String it : rightsId) {
System.out.println("获得的权限ID为："+it);
}
if (roleBizSer.addRiToRo(roId, rightsId) == 1) {
return "role_addRi_ok";
}else{
return "role_addRi_fale";
}
}
////////////////////// get set ////////////////////
//省略............
}以下为 Struts.xml 配置文件
<!-- 权限树初始化 -->
<package name="System_right" extends="struts-default,json-default" namespace="/">
<action name="searchRightTree" class="RolesAction" method="searchRightTree">
<result type="json">
<param name="root">permString</param>
</result>
</action>
</package>
以下为效果图
