160418、ztree权限菜单

1、页面中引用ztree的css和js(大家自行下载ztree)

<link rel="stylesheet" href="${ctx}/resources/js/plugins/ztree/zTreeStyle/demo.css" type="text/css">
<link rel="stylesheet" href="${ctx}/resources/js/plugins/ztree/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="${ctx}/resources/js/plugins/ztree/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/plugins/ztree/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/plugins/ztree/jquery.ztree.excheck-3.5.js"></script>

2、javascript

<script type="text/javascript">
var setting = {
/* check: {
enable: true
}, */
data: {
simpleData: {
enable : true,
idKey : "id",
pIdKey : "pId",
rootPId : "0"
}
},
callback : {
onClick : function(event, treeId, treeNode, clickFlag) {
if (treeNode.murl) {
var url = "${appctx}" + treeNode.murl;
document.getElementById("mainFrame").src = url;
}
}
}
};

var zNodes;

$(document).ready(function(){
$.ajax({
url : "${appctx}/menu/getMenuData.action",
type : "post",
dataType : "json",
async : false,
success : function(datas){
zNodes = datas;
}
});
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
</script>

3、body中添加div

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

注:后台返回的json数据

[{id:1, pId:0, name:"系统设置",open:true},{id:11, pId:1, name:"菜单管理"},{id:12, pId:1, name:"角色管理"},{id:13, pId:1, name:"人员管理"}];

时间: 2024-10-30 09:01:43

160418、ztree权限菜单的相关文章

通用权限管理系统之权限菜单zTree树的展示及移动的处理方法

在通用权限管理系统中,有很多数据结构是有父子关系的,如组织机构,部门,权限菜单等,在展示的时候,大多数是通过zTree树的形式展现的,如下: 权限菜单展示 这种数据后台输出比较容易处理,参考如下获取某个子系统的全部操作菜单: 后台输出zTree树的数据 /// <summary> /// 获取module树结构数据 /// </summary> /// <param name="systemCode"></param> /// <r

以后台权限菜单控制为例,获取js路径后面参数值

<script type="text/javascript" src="../Public/js/common.js?menuids=1,2,3,4,5&ckids=4-5-6" /></script> 需要注意的是,此段js文件位置需要放在页面中所有js包含文件后面,目前暂未想到好的办法解决位置问题. //获取js后面参数 function getUrlArg(){ var url = $("script:last&quo

简洁常用权限系统的设计与实现(一):构造权限菜单树的N(N&gt;=4)种方法

权限系统,Web开发常见标准子系统之一.结合自己的一些思考和实践,从本篇开始权限系统的设计与实现之路. 最近,重构了项目的权限菜单构造过程,向前端返回json格式的权限树. 这一篇,只是大致介绍下这个问题,并给出4种方法的整体思路,后续再分别详细介绍这4种方法,再往后介绍完整的权限系统的设计与实现. 权限表的结构: acl.parent_acl, 最重要的就是这2个字段,有了这2个字段,就可以构造一棵树了. 前端需要的json格式: "data":[{ "acl":

zTree树形菜单交互选项卡效果实现

1. 添加自定义属性 page 2. 为 ztree 每个树形节点,添加点击事件 1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>ztree树形菜单的使用</title> 7 <!-- 导入jquery核心类库 --> 8 <script type="text/javascript"

权限菜单设计

1.权限的作用意义 顾名思义,“权”代表“权力”,划分了系统的职权,不同的用户拥有不同的权力划分:“限”代表“限制”,在权力划分的基础上对职能范围进行了限制,本文所述的权限相对简单,赋予不同角色看到不同菜单的权限. 权限控制能较好地解决系统安全问题,避免公司机密资料外泄,同时,不同部门使用系统时互不干扰,因此被企业广泛应用. 2.梳理用户.角色的概念 (1)用户 用户是指系统的登录用户,可以理解为一系列的人员,例如登录用户为张三.李四.王五和肖六这几个人. (2)角色 角色指用户在系统中担任的角

WinForm实现对权限菜单进行管理

一.界面: 二.数据库访问类: 1 public class DataClass 2 { 3 private readonly string connect = ConfigurationManager.AppSettings["connectString"]; 4 public DataClass() { } 5 6 /// <summary> 7 /// 执行查询语句,返回DataSet 8 /// </summary> 9 /// <param na

通用权限管理系统菜单展示的一个技巧

从这篇文章,希望您了解吉日嘎拉通用权限管理系统菜单项展示技巧. 项目中使用了吉日嘎拉的通用权限管理系统,几十个子系统均由该权限管理系统管理. 在系统中配置好相关菜单及非菜单项,配置截图: 菜单权限设置截图 通过下拉菜单进入其中的一个子系统 子系统中的菜单项(菜单项表示该项会在前端需要展示出来,用于用户点击的项目),其中的公开表示所有人均可看到该菜单项目. 子系统中的非菜单项(非菜单项表示该项目不需要在前端展示出来,比如有些在页面中的弹出窗口.按钮等项目) 通过单点登录到子系统以后,通过一个服务获

谈Ztree菜单授权模块

用ssh,练习了一下Ztree的 菜单授权,简单的总结如下: 基本功能描述: admin管理员登录之后,对当前的用户可以 菜单授权.界面基本上就是下面这样子,便于理解,所以上传了. 基本思路: 菜单节点类: Menu 类 ,Ztree 数据格式 转换类 :TreeNode 类,pojo:User类,json数据转换类: JsonUtil类.因为小弟是用的注解.如有不方便之处,看到的人勿喷~ 1 @Entity 2 @Table(name = "t_menu") 3 public cla

jQuery树形菜单,使用zTree插件,异步加载 &amp; 编辑功能&amp;Check 共存

一.下载zTree插件 地址:http://www.ztree.me 二.HTML代码 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="zTree.aspx.cs" Inherits="CssStudyWeb.zTree" %> <!DOCTYPE html> <html xmlns="http://www.w3.org