ZTree + JQuery +Struts2 +SSH框架

做到一个用户角色权限配置的模块,上网找了找发现ZTree不错,于是研究啦一下,现在是凌晨,感觉效果出来了,就先发个帖子,记下来!

首先是在jsp页面导入 jQuery  和 ZTree 相关的外置文件

这可以在我的实例代码中找到

其中在去往权限树页面时无法正常通过struts 传递参数,所以用了笨的方法就是在小脚本内

  1. <strong><span style=”color:#990000;”>int roId = (Integer.parseInt(request.getParameter(“roId”)))</span></strong> 获得角色ID 然后传参给action 按照 角色查询已分配权限,这样就可以把已分配的权限 chec 设置为true,这个写在了Action 方法内。

下面是jsp的代码

  1. <%@ page language=”java” import=”java.util.*” pageEncoding=”UTF-8″%>
  2. <%@ taglib uri=”/struts-tags” prefix=”s”%>
  3. <%
  4. String path = request.getContextPath();
  5. String basePath = request.getScheme()+”://”+request.getServerName()+”:”+request.getServerPort()+path+”/”;
  6. int roId = (Integer.parseInt(request.getParameter(“roId”)));  //从上一个页面传过来用户ID
  7. %>
  8. <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
  9. <HTML>
  10.     <HEAD>
  11.         <TITLE>角色权限配置页面</TITLE>
  12.         <META http-equiv=Content-Type content=”text/html; charset=utf-8″>
  13.         <META content=”MSHTML 6.00.2900.5848″ name=GENERATOR>
  14.         <link type=”text/css” rel=”stylesheet” href=”<%=path%>/css/css.css” />
  15.         <link rel=”stylesheet”
  16.             href=”<%=path%>/js/JQuery zTree v3.3/css/demo.css” type=”text/css” />
  17.         <link rel=”stylesheet”
  18.             href=”<%=path%>/js/JQuery zTree v3.3/css/zTreeStyle/zTreeStyle.css”
  19.             type=”text/css” />
  20.         <script type=”text/javascript” src=”<%=path%>/js/jquery-1.9.0.js”></script>
  21.         <script type=”text/javascript”
  22.             src=”<%=path%>/js/JQuery zTree v3.3/js/jquery.ztree.core-3.5.js”></script>
  23.         <script type=”text/javascript”
  24.             src=”<%=path%>/js/JQuery zTree v3.3/js/jquery.ztree.excheck-3.5.js”>
  25.         </script>
  26.         <script type=”text/javascript”>
  27. var zTreeObj;
  28. var setting = {
  29.     check : {
  30.         enable : true
  31.     },
  32.     data : {
  33.         simpleData : {
  34.             enable : true
  35.         }
  36.     }
  37. };
  38. $(document).ready(function() {
  39.     //var tt ='<%=roId%>’;
  40.         // alert(tt);
  41.         var roId = ‘<%=roId%>’;
  42.         alert(roId);
  43.         var url = ‘<%=path%>/searchRightTree.action?roId=’ + roId;
  44.         alert(‘url:’ + url);
  45.         $.ajax( {
  46.             url : url,
  47.             type : “get”,
  48.             dataType : “json”,
  49.             success : initZtree
  50.         });
  51.     });
  52. function initZtree(json) {
  53.     alert(‘json’ + json);
  54.     // var data = (json.permString);
  55.     // alert(‘data’+data);
  56.     var zNodes = eval(“(” + json + “)”);
  57.     zTreeObj = $.fn.zTree.init($(‘#kpiTree’), setting, zNodes);
  58. }
  59. function submitCheckedNodes(treeNode) {
  60.     var nodes = new Array();
  61.     //取得选中的结点
  62.     nodes = zTreeObj.getCheckedNodes(true);
  63.     var str = “”;
  64.     for (i = 0; i < nodes.length; i++) {
  65.         if (str != “”) {
  66.             str += “,”;
  67.         }
  68.         str += nodes[i].id;
  69.     }
  70.     alert(str);
  71.     var rightsId = str;
  72.     var roId = $(“#roId”).val();
  73.     var roId = $(“#rightsId”).attr(“value”, rightsId);
  74.     ;
  75.     var roId = $(“#rightsId”).val();
  76.     alert(“页面隐藏id:” + roId + “__  rightsId:” + rightsId);
  77.     $(“form:first”).submit();
  78. }
  79. </script>
  80.     </HEAD>
  81.     <BODY
  82.         style=”BACKGROUND-POSITION-Y: -120px; BACKGROUND-IMAGE: url(‘<%=path%>/images/bg.gif’); BACKGROUND-REPEAT: repeat-x”
  83.         onload=”init();”>
  84.         <DIV style=”height: 200%”>
  85.                             <br>
  86.                             选择权限
  87.                             <hr color=”red”>
  88.                             <form action=”<%=path%>/addRiToRo_role.action” name=”checkForm”
  89.                                 method=”post”>
  90.                                 <div>
  91.                                     <ul id=”kpiTree” class=”ztree”></ul>
  92.                                 </div>
  93.                                 <input type=”hidden” name=”roId” value=”<%=roId%>” id=”roId” />
  94.                                 <input type=”hidden” name=”rightsId” id=”rightsId” />
  95.                                 <input type=”button” value=”提交” onclick=”submitCheckedNodes()” />
  96.                             </form>
  97.         </DIV>
  98.     </BODY>
  99. </HTML>

接下来是Action 内的代码

  1. public class RolesAction extends ActionSupport {
  2. //  Int
  3.     private int roId;  //存放角色ID
  4. //  String []
  5.     private String [] rightsId; //存放权限ID数组
  6. //  String
  7.     private String permString ;
  8. 并选中
  9.                     for (TRights tRi : alist) {
  10.                         if(tRi.getRightId().equals(ri.getRightId())){
  11.                             sb.append(“\”,checked:\””);
  12.                             sb.append(true);
  13.                         }
  14.                     }
  15.                 }
  16.                 sb.append(“\”}”);
  17.                 if (size > 0) {
  18.                     sb.append(“,”);
  19.                 }
  20.             }
  21.             sb.append(“]”);
  22.             this.permString = sb.toString();
  23.             System.out.println(“获得的json字符串为:”+this.permString);
  24.         } catch (Exception e) {
  25.             e.printStackTrace();
  26.         }
  27.         return SUCCESS;
  28.     }
  29. //  为角色添加权限(删除原先中间表信息,添加新的中间表信息)
  30.     public String addRiToRo(){
  31.         System.out.println(“获得权限ID数组大小:”+rightsId.length);
  32.         rightsId=rightsId[0].split(“,”);
  33.         for (String it : rightsId) {
  34.             System.out.println(“获得的权限ID为:”+it);
  35.         }
  36.         if (roleBizSer.addRiToRo(roId, rightsId) == 1) {
  37.             return “role_addRi_ok”;
  38.         }else{
  39.             return “role_addRi_fale”;
  40.         }
  41.     }
  42.     ////////////////////// get  set ////////////////////
  1. //省略…………
  1. }

以下为 Struts.xml 配置文件

  1. <!– 权限树初始化 –>
  2. <package name=”System_right” extends=”struts-default,json-default” namespace=”/”>
  3.     <action name=”searchRightTree” class=”RolesAction” method=”searchRightTree”>
  4.         <result type=”json”>
  5.             <param name=”root”>permString</param>
  6.         </result>
  7.     </action>
  8. </package>

以下为效果图

权限树

 

标签