Ext 根据来自后端的菜单数据创建树和节点

最新推荐文章于 2019-06-06 15:23:41 发布

trymore_

最新推荐文章于 2019-06-06 15:23:41 发布

阅读量616

点赞数

分类专栏： extjs 学习文章标签： ext border url

本文链接：https://blog.csdn.net/tqwwilliam/article/details/7257389

版权

extjs 学习专栏收录该内容

29 篇文章 0 订阅

订阅专栏

1. 获得包含菜单数据的数组：

// 获取菜单
var strTopMenus = Ext.getDom("strTopMenus").value; // 获取菜单
var aryTopMenus = strTopMenus.split(",");
var strTopMenusText = Ext.getDom("strTopMenusText").value;
var aryTopMenusText = strTopMenusText.split(",");

2. 创建树并添加到westPanel（手风琴式布局的panel）中

	/*----------------------------------------创建树的循环-------------------------------------*/
		var index4AryTopMenus = 0;
		for( index4AryTopMenus = 0; index4AryTopMenus < aryTopMenus.length; index4AryTopMenus++ ){
			
			var url4AryTopMenus = "MenuTree_" + aryTopMenus[index4AryTopMenus] + ".do";
			
			var aMenuTree = new Ext.tree.TreePanel({
				margins : '0 0 0 5',
					width : 250,
					split : true,
					minSize : 200,
					maxSize : 300,
					autoScroll : true,
					border : false,
					bodyStyle : 'padding:10px',
					rootVisible : false,
					loader : new Ext.tree.TreeLoader({
								dataUrl : url4AryTopMenus,
								requestMethod : 'POST'
							}),
					root : new Ext.tree.AsyncTreeNode({
								id : 'root',
								text : '',
								expanded : true
							})
				});
			aMenuTree.on('click', this.clickTree, this);
			
			westPanel.add({
				title : aryTopMenusText[index4AryTopMenus],
					border : false,
					collapsed : false,
					items : aMenuTree
			});
		}
		/*---------------------------------------/创建树的循环--------------------------------*/