ZTree + JQuery +Struts2 +SSH框架

来源：互联网发布：2017云计算大会 ppt 编辑：程序博客网时间：2024/05/19 19:44

做到一个用户角色权限配置的模块，上网找了找发现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><BODYstyle="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 {//Intprivate 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>

以下为效果图

权限树