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>

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