`
忘忧鸟
  • 浏览: 144597 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

DWZ横向导航实现动态左菜单树(基于zTree插件)

    博客分类:
  • DWZ
 
阅读更多
此篇文章是基于ztree实现,若是dwzztree未整合,请先按照《DWZzTree整合(实现版)》文章整合。

先上图片:



 

 

顶部菜单异步加载:

//加载顶部菜单
$.post("topMenu!topMenu.action",{},function(result){
   	var json = eval('(' + result + ')');
	var tm='<ul>';
	$.each(json, function(i,item){
		if(i==0){
		   	tm+='<li class="selected"><a href="javascript:void(0)" onclick="changeMenu(this,'+item.id+',\''+item.name+'\')"><span>'+item.name+'</span></a></li>';
		}else{
		    tm+='<li><a href="javascript:void(0)" onclick="changeMenu(this,'+item.id+',\''+item.name+'\')"><span>'+item.name+'</span></a></li>';
		}
		});
		tm+="</ul>";
		$("#navMenu").html(tm);
});	
$("#navMenu").html(tm);
});

 

子菜单树加载:

var subMenuSetting = {
	   async: {
		    enable: true,//启用异步加载
		    url:"tree!asyncTree.action", //异步请求地址
		    dataType:"text",
		    autoParam:["id"] //需要传递的参数,为你在ztree中定义的参数名称
		},
		data:{ // 必须使用data  
            simpleData : {  
                enable : true,  
                idKey : "id", // id编号命名 默认  
                pIdKey : "pId", // 父id编号命名 默认   
                rootPId : -1 // 用于修正根节点父节点数据,即pIdKey 指定的属性值  
            }
       	}, 
       	view: {
	    	dblClickExpand: false,
	    	showLine: true,
	    	selectedMulti: false,
	    	expandSpeed: ($.browser.msie && parseInt($.browser.version)<=6)?"":"fast"
	   	},
		callback: {
		    onAsyncSuccess: onAsyncSuccess
		 }
	};
	function onAsyncSuccess(event, treeId, treeNode, msg) {
		initUI($('#'+treeId));
  	}
  	
	function changeMenu(obj,id,name){
		//设置点击横向菜单后横向菜单的样式
		$('#navMenu ul li').each(function(idx){
		    $('#navMenu ul li').removeClass();
		});
		$(obj).parent().addClass("selected");
		//加载树
		$.post("topMenu!topSubTree.action",{id:id},function(result){
   	 		var json = eval('(' + result + ')');
        	    $.fn.zTree.init($("#ztreedemo"), subMenuSetting, json);
	    	    initUI($('#ztreedemo'));
      	});
}

 



 



 



 



 

  • 大小: 14.7 KB
  • 大小: 9.9 KB
  • 大小: 12.8 KB
  • 大小: 8.7 KB
  • 大小: 9 KB
0
0
分享到:
评论
7 楼 taigo 2014-09-30  
我最近也要实现这样的功能能否提供一份demo  ,谢谢  邮箱是158869200@qq.com  感激不尽
6 楼 s330526719 2014-09-01  
楼主大神,能给个demo吗,万分感谢!330526719@qq.com
5 楼 咫尺千山路 2014-07-10  
最近正在做这个,给个demo吧,461788603@qq.com 谢谢!!
4 楼 niweiwei 2014-05-16  
哥们,你这个demo的源代码,在不,可否提供一份,非常感谢
3 楼 iversongaoming 2014-03-19  
能否提供一份demo,谢谢,邮箱529239670@qq.com
2 楼 王雷震 2014-01-11  
能给一个json格式不
1 楼 eryuenifeng 2013-11-05  
能否提供一份demo  ,谢谢  邮箱是8812512@163.com  感激不尽

相关推荐

    dwz,ztree整合,操作都在头部

    ZTree则是一个专门用于树形结构展示的插件,它支持Ajax动态加载数据,提供了丰富的API和事件,可以方便地实现节点的增删改查、展开/折叠、选中等操作。ZTree常用于文件管理、组织结构展示、权限控制等领域。 当我们...

    简单的dwz动态管理菜单

    "简单的dwz动态管理菜单"是一个基于DWZ小框架实现的管理系统的核心功能模块,主要目的是为用户提供根据权限定制的动态菜单。在Web开发中,动态菜单是管理界面不可或缺的一部分,它能够根据用户的角色和权限来展示...

    简单实用国产jQuery UI框架 - DWZ富客户端框架DWZ RIA 1.4.4 (20121016 修正了横向导航js报错问题)

    DWZ RIA 1.4.4 (20121016 修正了横向导航js报错问题) 修复使用xheditor插件IE下兼容问题:IE下打开一个含有编辑器的页面,然后关闭,再打开不能录入问题 修复多文件上传插件uploadify 的html扩展方式,java读取不...

    asp.net整合dwz ztree实现用户管理权限登录管理

    ZTree是一个基于jQuery的树形插件,它支持多种数据结构,能轻松实现各种复杂的树形操作,如节点增删改查、拖拽排序、多选等功能。在用户管理和权限管理的场景下,ZTree很可能用于展现层次化的权限结构,如用户组、...

    为dwz扩展树形下拉框

    标题“为dwz扩展树形下拉框”指的是在DWZ(Dynamic Web Zone)框架中对树形下拉框功能的扩展。DWZ是一个基于jQuery的前端开发框架,主要用于构建富交互式的Web应用。这个扩展可能涉及到在原有的DWZ组件基础上增加或...

    dwz完美整合ztree,kindeditor,My97DatePicker

    这份DWZ代码是我个人一直使用的,DWZ对各版本IE的兼容性是比较好的,我的代码在IE6下也基本能正常使用,这是一直舍不得换其它框架的主要原因。 压缩包是完整的jfinal+dwz的测试性小代码,直接导入myeclipse,运行...

    dwz修改菜单图标

    当我们谈论“dwz修改菜单图标”时,我们实际上是在讨论如何自定义DWZ框架中的导航菜单的图标,以符合项目需求或者提升用户体验。 首先,我们需要了解DWZ框架的结构。DWZ通常包含CSS样式文件、JavaScript脚本、图片...

    JUI(DWZ)集成第三方布局插件

    **标题:“JUI(DWZ)集成第三方布局插件”** DWZ,全称为Dynamic Web Zone,是一款基于jQuery的前端框架,主要用于构建响应式、易用的Web应用。本话题聚焦于如何在DWZ框架中集成第三方布局插件,以增强用户界面的...

    dwz 下拉框左右选择

    在IT行业中,"dwz 下拉框左右选择"通常指的是一个特定的UI组件,它用于在Web应用中实现用户交互。DWZ(Dynamic Web Zone)是一个开源的JavaScript框架,专门用于构建富客户端的Web应用程序。这个框架提供了丰富的UI...

    dwz完美整合ztree3.5(包括excheck),kindeditor,My97DatePicker

    最初在CSDN上发了这份代码,整合了ztree3.3的核心部分,详情可以参看这个地址的说明: http://download.csdn.net/detail/ohaozy/8691959 据部分朋友的意见,需要使用ztree的excheck功能,于是我重新整合了ztree3.5,...

    spring mvc,mybatis,Shiro,dwz实现的通用后台系统

    本篇文章将详细解析一个基于Spring MVC、MyBatis、Apache Shiro以及DWZ(EasyUI的轻量级前端框架)实现的通用后台系统,旨在帮助开发者理解这些技术如何协同工作,打造高效能的应用。 首先,Spring MVC是Spring框架...

    基于DWZ富客户端框架的ssh2的项目 dwz4j

    【标题】"基于DWZ富客户端框架的ssh2的项目 dwz4j"是一个整合了SSH2(Spring、Struts2、Hibernate)三大框架与DWZ富客户端框架的Web应用程序项目。DWZ富客户端框架(DWZ UI Framework)是专为开发人员提供的一种轻量...

    基于dwz搭建的一个网站源码

    DWZ是一个开源的前端MVC框架,专为Web2.0应用设计,它集成了丰富的UI组件,如表格、对话框、树形菜单等,大大简化了网页开发工作。在本项目中,使用的是DWZ的1.4.6版本,该版本对性能进行了优化,并修复了一些已知...

    dwz .net 简单分页 表头排序、查询

    【标题】:“DWZ.NET 简单分页、表头排序及查询”是指在.NET开发环境中使用DWZ(Dynamic Web Zone)框架实现的一种高效、便捷的网页数据展示功能。DWZ.NET是一款基于Ajax的前端交互框架,尤其适用于构建富交互性的...

    dwz 帮助文档

    3. **导航与菜单**:DWZ的导航菜单支持多级、折叠、下拉等效果,可以动态加载和管理菜单项,实现动态权限控制。 4. **表单处理**:框架内置了表单验证功能,可以自动验证表单数据,支持自定义验证规则。同时,通过...

    通用后台系统,基于spring mvc,mybatis,Shiro,dwz 实现的

    这是一个基于Java技术栈开发的通用后台管理系统,涵盖了Spring MVC、MyBatis、Shiro和DWZ框架的核心功能和实现方式。下面将详细讲解这些技术及其在系统中的应用。 首先,Spring MVC是Spring框架的一部分,主要负责...

    dwz最完整demo

    DWZ,全称为“Dynamic Web Zone”,是一款基于jQuery的前端MVC框架,主要应用于Web应用的界面开发。这个“dwz最完整demo”是开发者们学习和了解DWZ框架功能和用法的重要资源,它包含了DWZ框架的各种示例和小例子,...

    DWZ框架的一些用法

    树形菜单组件能够帮助开发者构建层级结构的数据展示,支持异步加载、展开/折叠、点击事件处理等功能,常用于导航或权限管理。 7. **表格(Grid)**: DWZ的表格组件支持动态加载、排序、过滤、编辑等功能,能够...

    dwz_bootstrap_javascript_jquery_

    Bootstrap包含了一系列预定义的样式、组件和JavaScript插件,如导航栏、模态框、下拉菜单等,使得开发者能够快速构建美观且一致的用户界面。 【JavaScript】是一种广泛使用的客户端脚本语言,主要用于实现网页的...

    C# DWZ 项目案例

    它提供了丰富的页面组件,如表格、表单、对话框、树形结构、分页、下拉菜单等,极大地简化了前端开发工作,提高了用户体验。DWZ与后端语言如PHP、Java、C#等配合使用,实现数据交互和业务逻辑处理。 在这个“C# DWZ...

Global site tag (gtag.js) - Google Analytics