最近需要做一个zTree+EasyUi的权限管理系统，以前有过接触，在做这一块时，用到了ztree，树来加载咱们的菜单栏，后台获取登录用户信息的权限列表，转换成json对象来加载到咱们的树当中，代码如下：

　　　　

$(function(){

			var title ;

			var url;

				var setting = {

					data: {

							simpleData: {

								enable: true,

								idKey:"id",

								pIdKey:"pid"

							},

							key: {

								name: "pname",

								url:"_"

							},

							keep: {

								leaf: false

							}

						},

						callback: {

							onClick: zTreeOnClick

						}

				};

			var zNodes ;

			$.ajax({

	  				async:false,

	  				url:"<%=path%>/power/getPower.action?uid="+1,

	  				type:"post",

	  				data:{},

	  				dataType:"json",

	  				success:function (obj){

	  					zNodes = obj;

	  				}

	  			});
}
加载玩树之后。因为数据库里的每个权限都带有一个URL的地址，

　

在不做处理的情况下，树节点会自动加载出来，以至于，我们每一次点击例如角色分配这些节点，会重新生成一个新的窗口，后来经百度，查看ztree的api




你会发现人家早就想到了这一点，来实现这个效果，那么， 我们就可以运用到自己的ztree当中了，




只需要配置一个空的或者无用的连接就可以了，




那么，我要的效果就可以展示出来了，希望写这一小段可以帮助到，港开始接触朋友们，谢谢，如需转载，请注明出处，旺仔搬砖在此深刻感谢！


整个jsp页面如下：




<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

  </head>

    <base href="<%=basePath%>">

    <title>M_xw</title>

	<link rel="stylesheet" type="text/css" href="<%=path%>/jquery-easyui-1.5/themes/icon.css">

    <link rel="stylesheet" type="text/css" href="<%=path%>/jquery-easyui-1.5/themes/default/easyui.css">

	<link rel="stylesheet" href="<%=request.getContextPath() %>/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css"></link>

	<script type="text/javascript" src="<%=path%>/css/jquery-1.7.js"></script>

	<script type="text/javascript" src="<%=path%>/jquery-easyui-1.5/locale/easyui-lang-zh_CN.js"></script>

	<script type="text/javascript" src="<%=path%>/jquery-easyui-1.5/jquery.easyui.min.js"></script>

  	<script type="text/javascript" src="<%=request.getContextPath() %>/zTree/js/jquery.ztree.core.js"></script>

	<script type="text/javascript" src="<%=request.getContextPath() %>/zTree/js/jquery.ztree.excheck.min.js"></script>

  	<script type="text/javascript">

	$(function(){

			var title ;

			var url;

				var setting = {

					data: {

							simpleData: {

								enable: true,

								idKey:"id",

								pIdKey:"pid"

							},

							key: {

								name: "pname",

								url:"_"

							},

							keep: {

								leaf: false

							}

						},

						callback: {

							onClick: zTreeOnClick

						}

				};

			var zNodes ;

			$.ajax({

	  				async:false,

	  				url:"<%=path%>/power/getPower.action?uid="+1,

	  				type:"post",

	  				data:{},

	  				dataType:"json",

	  				success:function (obj){

	  					zNodes = obj;

	  				}

	  			});

			$(document).ready(function(){

				$.fn.zTree.init($("#treeDemo"), setting, zNodes);

			});

		});

		function zTreeOnClick(event, treeId, treeNode){

			var title=treeNode.name;

			var url=treeNode.url;

		     	      var b = $("#tt").tabs("exists",title);

		     	       if(b){

		     	         var tab =  $("#tt").tabs("select",title);

		     	          $('#tt').tabs('update', {

									tab: tab,

									options: {

									//	title: title,

									},

								});

		     	       }else{

				     	     $('#tt').tabs('add',{

								title: title,

								href:url,

								closable: true

							});

		      	       }

		}

  	function a(url){

  		alert(url);

  	}

  	</script>

  <body class="easyui-layout">

        <div data-options="region:'north',title:'North Title',split:true" style="height:100px;">

        			<h3 style="margin-left: 500px;">欢迎进入学院管理平台</h3>

		        	<a href="" style="float: right; ">修改密码</a>

		        	<a href="" style="float: right;  margin-left: 200px; padding-left: 200px;">点击注销</a>

        </div>

        <div data-options="region:'east',title:'East',split:true" style="width:100px;"></div>

        <div data-options="region:'west',title:'West',split:true" style="width:100px;">

        		<ul class="ztree" id="treeDemo"></ul>

  				<input type="button" value="提交" id="btn" />

        </div>

        <div data-options="region:'center',title:'center title'"  style="padding:5px;background:#eee;">

			<div data-options="region:'center',title:'列表展示',iconCls:'icon-add'"></div>

	         <div id="tt" class="easyui-tabs"  url="<%=path%>/power/ct.action" data-options="fit:true,border:false,plain:true">

	         </div>

        </div>

  </body>

</html>





　　
												


											
zTree+EasyUi做权限遇到的小问题的更多相关文章
	

    
								
  1. ASP.NET MVC+EF框架+EasyUI实现权限管理系列
		
    http://www.cnblogs.com/hanyinglong/archive/2013/03/22/2976478.html ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开 ...
    
		
    2. 
						
  2. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(14)-主框架搭建
		
    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(14)-主框架搭建    ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2 ...
    
		
    3. 
						
  3. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(13)-权限设计
		
    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(13)-权限设计 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据 ...
    
		
    4. 
						
  4. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(12)-实现用户异步登录和T4模板
		
    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(12)-实现用户异步登录和T4模板 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建  ...
    
		
    5. 
						
  5. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(10)- VSS源代码管理
		
    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(10)- VSS源代码管理 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    ( ...
    
		
    6. 
						
  6. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(9)-TT模板的学习
		
    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(9)-TT模板的学习 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2): ...
    
		
    7. 
						
  7. ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开篇
		
    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开篇 前言:博客又有一段时间没有更新了,心里感觉这段时间空空的,好像什么都没有学下,所以就想写博客,所以就有了这个系列,这里当然也 ...
    
		
    8. 
						
  8. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(24)-权限组的设计和实现(附源码)(终结)
		
    ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据库访问层的设计Demo    (3):面向接口编程   (4 ):业务逻辑层的封装    ...
    
		
    9. 
						
  9. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(22)-为用户设置角色
		
    ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据库访问层的设计Demo    (3):面向接口编程   (4 ):业务逻辑层的封装    ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 错误提示sudo: no tty present and no askpass program specified Sorry, try again.
			
    php调用shell脚本的svnup.php文件内容: <?set_time_limit(0);//$output = array();$ret = 0;exec("/usr/bin/ ...
    
			
    2. 
						
  2. limux curl命令
			
    linux curl命令很强大: http://blog.chinaunix.net/uid-14735472-id-3413867.html curl是一种命令行工具,作用是发出网络请求,然后得到和 ...
    
			
    3. 
						
  3. oracle表结构和表内容差异比对
			
    oracle表结构和表内容差异比对 oracle中有三种集合操作,他们会把左边和右边的select 结果集进行集合操作. union 并集 intersect 交集 minus 差集 假设有如下两张表 ...
    
			
    4. 
						
  4. PLSQL win7 64位
			
    1. 解压instantclient-basic-win32-11.2.0.1.0.zip至Oracle安装目录的Product下 具体目录如下D:\Oracle\product\instantcli ...
    
			
    5. 
						
  5. JavaWeb---通过ServletConfig获取Servlet的初始化参数
			
    package com.zyz; import javax.servlet.ServletConfig; import javax.servlet.ServletException; import j ...
    
			
    6. 
						
  6. 第1周 支路变量、元件、KCL和KVL
			
    第1周的内容,介绍了: 电阻.独立源.受控元件等实体元器件, 电流.电压.功率等抽象名词, 端口.参考方向等分析时的概念工具, KCL.KVL两大分析定律, 解线性电路的普适方法----2B法. 引入 ...
    
			
    7. 
						
  7. jQuery Mobile 中创建按钮
			
    在 jQuery Mobile 中创建按钮 jQuery Mobile 中的按钮可通过三种方法创建: 使用 <button> 元素 使用 <input> 元素 使用 data- ...
    
			
    8. 
						
  8. 转js中this指向的简明解答
			
    JS中的this对象详解   JS中this关键字很常见,但是它似乎变幻莫测,让人抓狂.这篇文章就来揭示其中的奥秘. 借助阮一峰老师的话:它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用. ...
    
			
    9. 
						
  9. Linux centOS下搭建RTMP服务器的具体步骤
			
    以下的所需的安装包,可直接在linux系统终端下载,也可从其他地方下载之后拷到对应目录下解压使用,遇到连接不到国外网站时可改变压缩包地址 1.安装依赖包: #yum install glibc.i68 ...
    
			
    10. 
						
  10. 把vim当做golang的IDE
			
    开始决定丢弃鼠标,所以准备用vim了. 那么在vim里面如何搭建golang环境呢? git盛行之下,搭建vim环境是如此简单. 而且vim搭建好了之后,基本上跟IDE没有差别. 高亮.自动补全.自动 ...
    
			
    11.