`
minzaipiao
  • 浏览: 148607 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

Extjs 动态菜单

阅读更多
//左边放一个手风琴菜单
	var cascadeMenu = new Ext.Panel({
		region: 'west',
	    resizable:true,
	    title: '功能区',
	    id:'westMenu',
	    layout:'accordion',
	    collapsible:true,
	    collapseMode:'mini',
	    collapseFirst:true,
	    split:true,
	    width:250,
	    minSize: 175,
      	maxSize: 500,
	    layoutConfig: {	     
	        titleCollapse: true,
	        animate: false,
	        activeOnTop: false
	    }
	}); //手风琴菜单结束
	
	// 构建左边的菜单
	Ext.Ajax.request({
				url : 'MenuServlet?action=main',
				success : function(response, options) {
					var arr = Ext.decode(response.responseText);
					for (var i = 0; i < arr.length; i++) {
						var panel = new Ext.tree.TreePanel({
									id : arr[i].id,
									title : arr[i].text,
									iconCls : arr[i].iconCls,
									autoScroll : true,
									border : false,
									loader : new MenuLoader({
												dataUrl : 'MenuServlet?action=sub&id='+ arr[i].id
											}),
									root : new Ext.tree.AsyncTreeNode({
												expanded : true
											}),
									listeners:{
										'click':function(node){
								  			Ext.get('center_iframe').dom.src = node.attributes.hrefsrc;
								  			if(node.attributes.text!=null){
	
							  				}
										}
									},
									rootVisible : false
								});
						cascadeMenu.add(panel);
						panel.on('expand', function(p) {
									var expires = new Date();
									expires.setDate(expires.getDate() + 30);
								});
					}
					cascadeMenu.doLayout();
				}
			});


后台servlet
if(StringUtils.equals(action, "main")){
					Document doc = XMLUtils.load(filePath);
					StringBuffer sb = new StringBuffer("[");
					if (doc != null) {
						Element root = doc.getRootElement();
						List els = root.elements();
						for (int i = 0; i < els.size(); i++) {
							Element el = (Element) els.get(i);
							Attribute id = el.attribute("id");
							Attribute text = el.attribute("text");
							Attribute iconCls = el.attribute("iconCls");
							sb.append("{id:'").append(id == null ? "" : id.getValue()).append("',");
							sb.append("text:'").append(text == null ? "" : text.getValue()).append("',");
							sb.append("iconCls:'").append(iconCls == null ? "" : iconCls.getValue()).append("'},");
						}
						if(els.size()>0){
							sb.deleteCharAt(sb.length()-1);
						}
					}
					sb.append("]");
					out.println(sb.toString());
				}else if(StringUtils.equals(action, "sub")){
					response.setContentType("text/xml");
					Document doc=XMLUtils.load(filePath);
					String id=request.getParameter("id");
					StringBuffer sb=new StringBuffer("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
					List services = bean.findAllService();
					if(doc!=null){
						sb.append("<Menus>");
						
							Element el=doc.getRootElement();
							List nodes=el.selectNodes("/Menus/Items[@id='"+id+"']/*");
							for(int i=0;i<nodes.size();i++){
								Node node=(Node)nodes.get(i);
								sb.append(node.asXML());
							}
						
						sb.append("</Menus>");
					}
					out.println(sb.toString());
					
				}
分享到:
评论

相关推荐

    Extjs动态加载菜单

    动态加载菜单是ExtJS中的一个关键特性,它允许在用户交互过程中动态地创建、修改和加载菜单项,提供了更灵活的用户界面设计。在“Extjs动态加载菜单”这个主题中,我们将深入探讨这一功能的实现方式以及相关技术。 ...

    Extjs 动态菜单、树节点的增删查改

    提供Extjs树的动态菜单生成,已及对树的增删查改该操作

    EXTJS4 菜单栏

    5. **动态更新**:在运行时,你可以通过调用`add`、`remove`、`insert`等方法来动态修改菜单栏的内容。这使得菜单栏可以根据用户权限或应用状态进行实时更新。 6. **事件处理**:EXTJS4的菜单项支持多种事件,如`...

    EXTJS---完整数据库代码,全网唯一,非常适合EXTJS搭建框架,包含动态树,菜单等

    这个压缩包文件的内容看起来是一个完整的EXTJS项目,包含了数据库交互、动态树结构和菜单功能,并且集成了SpringMVC后端框架以及JDBC数据访问层。 1. **EXTJS动态树**: EXTJS的动态树(TreePanel)组件允许开发者...

    extjs实现动态树加载菜单

    动态树加载菜单是 ExtJS 中一种常见且实用的功能,它允许用户在需要时按需加载树节点,从而提高应用性能,减少初次加载时的数据量。 动态树加载,也称为懒加载或按需加载,是指在用户滚动、展开节点或执行其他操作...

    ExtJs 动态添加表单

    在"动态添加表单"这个主题中,我们将深入探讨如何在ExtJS中实现表单的动态创建和管理。 首先,我们要理解表单(Form)在ExtJS中的基本概念。表单是数据输入和验证的核心组件,可以包含各种字段类型,如文本框、下拉...

    Extjs 下拉菜单实现拼音输入进行检索

    Extjs 下拉菜单实现拼音输入进行检索

    extjs desktop相关 动态生成开始菜单 多级菜单的快捷方式

    标题中的“ExtJS Desktop相关 动态生成开始菜单 多级菜单的快捷方式”涉及到的是一个使用ExtJS框架实现的桌面应用模拟系统,它能够创建类似Windows操作系统的开始菜单,并支持多级菜单结构来快速访问应用程序或功能...

    extjs4.0 实现了主页面框架 动态菜单 例子 表单 ajax

    extjs4.0 实现了主页面框架(主框架使用Ext.Viewport,banner使用Ext.panel.Panel,通过toolbar来放置按钮),包括左侧动态菜单实现(采用Ext.tree.Panel)动态从数据库加载数据来显示菜单(后台代码也在了通过json...

    extjs4 导航菜单实例

    这篇博客文章“extjs4 导航菜单实例”将深入探讨如何在ExtJS 4中创建和使用导航菜单,这对于构建具有层次结构和动态功能的用户界面至关重要。 在ExtJS中,导航菜单通常通过`Ext.menu.Menu`类来实现,这是一个可弹出...

    extjs动态树struts请求数据

    ExtJS 动态树结构与Struts框架结合,主要用于构建基于Web的动态树形界面,让用户能够以图形化的方式查看和操作层次结构的数据。在这一过程中,Struts作为MVC框架负责后端业务逻辑处理,而ExtJS则作为前端展示库,...

    menu-dinamico-extjs:动态 ExtJS 菜单

    带有 PHP 的 ExtJS 动态菜单这是使用 PHP 的 ExtJS 动态菜单示例,我的意思是使用 PHP,但它可以用任何后端语言完成。 此存储库包含 Ext 项目 5.1 版的“app”文件夹。 菜单由“menu.php”文件定制。 如下: &lt;?...

    Extjs动态GRID

    EXTJS动态GRID是一种基于JavaScript的前端开发框架EXTJS中的组件,用于展示数据并提供交互功能。EXTDRID(可能是EXTGRID的拼写错误)是指EXTJS中的Grid Panel,它允许开发者构建灵活、可配置的数据视图,适用于大量...

    Extjs 无限树菜单 后台拼接json

    总结来说,"Extjs 无限树菜单 后台拼接json"涉及到的技术点包括:ExtJS的树形组件使用、后台动态生成JSON、无限滚动加载策略、以及前端和后端的异步通信。通过这样的方式,我们可以构建出动态、可扩展且高效的树形...

    extjs的菜单源码

    extjs菜单设计源码,详细的介绍了 如何用extjs 设计菜单

    ExtJS4 2学习 21 动态菜单与表格数据展示操作总结篇

    在"ExtJS4 2学习 21 动态菜单与表格数据展示操作总结篇"中,我们将深入探讨两个核心组件:动态菜单(Dynamic Menus)和表格数据展示(Grid Data Display),以及如何在实际应用中进行操作。 动态菜单在Web应用中...

    extjs4.2 desktop 拓展

    总结来说,ExtJS 4.2 Desktop 拓展是一个集成了多种桌面特性并优化了基础框架的解决方案,它提供了图标换行、窗口拖动、多级开始菜单等功能,使得开发复杂的Web应用变得更加简单和直观。通过下载提供的LinBDesk4.2...

    ExtJs菜单导航功能,不在用左边功能树

    "ExtJs菜单导航功能,不在用左边功能树"这一主题,旨在探讨如何在不使用左侧树形结构的情况下,利用ExtJs实现高效且现代感的菜单导航。 ExtJs是一款强大的JavaScript库,专门用于构建富客户端应用。它提供了丰富的...

    ExtJS5树形菜单

    在ExtJS5中,树形菜单(Tree Menu)是一种常见的UI组件,它允许用户以层次结构的方式展示数据,非常适合用于目录浏览、文件系统导航或者复杂的组织结构展示。在本篇文章中,我们将深入探讨ExtJS5树形菜单的使用方法...

    Extjs 登录 分栏菜单

    实现了 登录 动态分栏菜单 实现了 登录 动态分栏菜单实现了 登录 动态分栏菜单实现了 登录 动态分栏菜单实现了 登录 动态分栏菜单实现了 登录 动态分栏菜单实现了 登录 动态分栏菜单实现了 登录 动态分栏菜单

Global site tag (gtag.js) - Google Analytics