ExtJs定义树形菜单

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>测试页面</title>
		<meta http-equiv="content-type" content="text/html; charset=gbk" />
		<link rel="stylesheet" type="text/css"
			href="./ext/resources/css/ext-all.css" />
		<script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
		<script type="text/javascript" src="./ext/ext-all.js"></script>
	</head>
	<script type="text/javascript">
	Ext.onReady(function(){
		// 树形配置开始
	    var treePanel = new Ext.tree.TreePanel({   
	        id: 'tree-panel',   
	        title: '树形菜单示例',   
	        renderTo:'div1', //北边   
	        split: true, //可以调节大小 
	        width:220,
	        height: 500, //默认高度为500px   
	        minSize: 150, //最小高度为150px   
	        autoScroll: true,//允许滚动条   
	           
	        // tree-specific configs:   
	        // 树控件的特有的配置选项   
	        rootVisible: false,//隐藏根结点   
	        lines: true,   
	        singleExpand: false,//同时只能打开一个树,当打开其中任何一个树时,将会关闭其他已经打开的树目录   
	        useArrows: true,//树形目录使用visita中树目录显示效果(三角形代替+号)   
	           
	        loader: new Ext.tree.TreeLoader({   
	            dataUrl:'file/tree-data.json'//树目录数据加载为本地json数据文件   
	        }),   
	           
	        root: new Ext.tree.AsyncTreeNode()   
       });   
	    // 树形配置结束
	});
	</script>
	<body>
		<div id='div1'></div>
	</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章