利用Ext Js生成动态树
利用Ext Js生成动态树今天在公司帮同事写了个用Ext Js生成动态树的Demo，在这里分享一下，也好供以后自己查阅。
一. 需求
[*]要求生成一颗部门树，初始只列出根部门
[*]当点击一个部门节点时，动态载入该部门下的直属子部门，并展开该部门节点
[*]部门节点要求支持右键单击事件，当点击右键时，列出相关操作菜单
二. 关键类
这里主要涉及Ext JS的两个类:
[*]Ext.tree.TreeNode
[*]Ext.menu.Menu
相关API可以参考：http://extjs.com/deploy/ext/docs/
三. 代码示例
1. 先看一下测试页面
<div class="highlighter">
[*]<html>
[*]<head>
[*]<metahttp-equiv="Content-Type"content="text/html;charset=utf-8">
[*]<title>ReorderTreePanel</title>
[*]<linkrel="stylesheet"type="text/css"href="../../resources/css/ext-all.css"/>
[*]<scripttype="text/javascript"src="../../adapter/ext/ext-base.js"></script>
[*]<scripttype="text/javascript"src="../../ext-all.js"></script>
[*]<scripttype="text/javascript"src="reorder.js"></script>
[*]
[*]<!--CommonStylesfortheexamples-->
[*]<linkrel="stylesheet"type="text/css"href="../shared/examples.css"/>
[*]<linkrel="stylesheet"type="text/css"href="../shared/lib.css"/>
[*]
[*]<scripttype="text/javascript">
[*]/**************
[*]onload事件
[*]***************/
[*]window.onload=function(){
[*]createTree(3);
[*]}
[*]</script>
[*]
[*]</head>
[*]<body>
[*]<scripttype="text/javascript"src="../shared/examples.js"></script>
[*]<h1>现在要生成一颗动态树</h1>
[*]<divid="container">
[*]</div>
[*]</body>
[*]</html>
[*]
页:
[1]