最近需要做一个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. zTree入门-最简单的树
			
    最近发现项目中很多地方都是树形菜单,而这些树形菜单都是使用树形插件zTree来制作的,所以就想自学一下zTree,参照官方文档写了一个简单的案例,使用zTree做了 一个最简单的树形结构. 案例:zT ...
    
			
    2. 
						
  2. DIOCP之DEMO-Echo卡死问题分析
			
    最近很多新朋友在调试echo这个例程时发现,总是卡死客户端或服务器端,这是因为客户端的接收数据用的memo没有处理接受到的行数,导致超过最大行数,而卡死界面,只需要如下操作就可以解决: 引用弦子的:虽 ...
    
			
    3. 
						
  3. mysql 行转列 和 列转行
			
    我们有时会将一些数据已逗号的连接方式存在数据库,当取出时我们又想单独一个个取出来 利用help_topic 的自增性 LENGTH(wu.`password`) - length(replace(wu ...
    
			
    4. 
						
  4. iOS中线程同步基本详解
			
    为什么使用线程同步技术:多个线程是同时执行的 如果多个线程同时操作一个资源 会造成此资源的数据错乱 线程同步简介 线程同步,多条线程按顺序地访问某个资源 注意:此处的同步不是一起执行的意思 是一个一个 ...
    
			
    5. 
						
  5. js中常用的操作
			
    1.js中常用的数组操作 2.js中常用的字符串操作 3.js中常用的时间日期操作 4.定时器
    
			
    6. 
						
  6. NOT IN查询效率低，用它的等效写法提高效率。
			
    最近在处理大数据量导入的时候,使用OPENROWSET将Excel导入到临时表中之后,需要对数据进行唯一性验证.这时候发现使用NOT IN严重影响效率,一条sql可能执行10分钟甚至更久.尝试改变写法 ...
    
			
    7. 
						
  7. 2013 acm 长沙网络赛 G题 素数+枚举 Goldbach
			
    题目 http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3856 先预处理求出两个素数的和与积,然后枚举n-prime和n/pr ...
    
			
    8. 
						
  8. Register DLL Assembly   Gacutil.exe（全局程序集缓存工具）
			
    全局程序集缓存工具使你可以查看和操作全局程序集缓存和下载缓存的内容. 此工具会自动随 Visual Studio 一起安装. 若要运行此工具,请使用开发人员命令提示(或 Windows 7 中的 Vi ...
    
			
    9. 
						
  9. $.each与$().each
			
    在jquery中,遍历对象和数组,经常会用到$().each和$.each(),两个方法.两个方法是有区别的,从而这两个方法在针对不同的操作上,显示了各自的特点. $().each,对于这个方法,在d ...
    
			
    10. 
						
  10. pxe无人值守安装多网卡注意事项
			
    pxe无人值守安装linux配置这里就不说了,直接看这篇博客http://www.cnblogs.com/mchina/p/centos-pxe-kickstart-auto-install-os.h ...
    
			
    11.