ExtJs 树形机构封装使用说明.doc

ExtJs 树形结构封装使用说明一 Js类1. 引用路径2. 构造方法 var tree = new createtree(); 3. 使用实例/一般用法var tree = new createtree(); tree.setTreeJson(jsonStr);/树对应的Json数据tree.setTitle(组织机构);/树标题tree.setElId(treeorg);/包含树的容器IDtree.setWidth(250);/树宽度tree.setHeight(300);/树高度tree.render();/渲染树4.二 方法说明 setTreeJson（str）/设置TreePanel 初始化Json数据,str是Json格式的字符串 getElementById(id) /根据ID取得节点 setSingleClick(flag) /是否单击展开 flag是boolean型变量 setExpanded(flag) /设置是否自动展开 setTitle(title) /设置标题 setElId(id) /设置Tree的容器ID setWidth(width) /设置宽度 setHeight(height) /设置高度 getRootNode() /返回根节点 isRootView(flag) /是否显示根节点 flag是boolean型变量 setInitCheckedSelector(selector) /设置初始化选中节点的过滤器 addEventFunc(eventKey,func) /添加事件响应方法 eventKey是事件标识,一般使用的事件是checkchange;func是事件响应函数名（不加引号）或对象 addNodesFilter(func) /添加节点数组过滤器。Func过滤器对象或过滤器链对象 getChecked() /取得选中的节点。返回一个MyTreeNode(Ext.tree.TreeNode的子类)型数组 clear() /删除选中的节点三 事件响应1. 事件响应函数函数名(node,checked,mytree)参数说明：Node 触发事件的节点Checked 节点是否被选中Mytree 树形对象2. 事件响应对象事件响应对象必须实现一个run方法。声明格式：run(node,checked,mytree)参数说明：Node 触发事件的节点Checked 节点是否被选中Mytree 树型对象3. 预建的事件响应对象SingleCheckFunc 单选效果MultiCheckFunc 级联多选效果四 过滤器1. ValueSingleEquals 单个值相等匹配构造函数：ValueSingleEquals(obj) obj是个js值对象 如nodeFlag:employee2. ValueInArray 值包含匹配构造函数：ValueInArray(field,array) field是树节点的树形名,array是数组3. NodeSelectorStacks 过滤器链构造函数：NodeSelectorStack(runFlags) runFlags过滤器级联运算标志，包括or和and。Or为或运算,and为与运算。4. NodesFilter 节点数组过滤器 构造方法： NodesFilter.getInstance(obj) obj是个(ValueSingleEquals和ValueInArray对象)五 合成树 TreeAppendLeaf 树形结构Json数据合成类 构造方法： TreeAppendLeaf() 合成数据方法： toJoin(jsonStr1,jsonStr2) jsonStr1是父树的Json数据，jsonStr2是子树的Json数据。六 例子 /带初始化选择的部门树 var tmptt = new createtree(); /构造对象 /* *单值匹配过滤器 匹配nodeFlag属性值为org的节点 */var sl2 = new ValueSingleEquals(nodeFlag:org); /* *值包含过滤器 * 匹配code属性值为xt0001和XT8880000000001的节点 */var slarr = new ValueInArray(code,xt0001,XT8880000000001); /* * 过滤器堆栈 使用与运算方式 * 匹配同时满足 sl2和slarr两个过滤器的节点 * */var initstack = new NodeSelectorStack(and);initstack.addSelector(sl2);initstack.addSelector(slarr); /* *设置Json数据 */tmptt.setTreeJson(Ext.decode(treejson);tmptt.setTitle(选择员工所在的机构);/树标题tmptt.setElId(treeorg);/树容器IDtmptt.setWidth(250);/树宽度tmptt.setHeight(300);/树高度/* 节点数组过滤器,在返回选中节点是进行过滤* */tmptt.addNodesFilter(NodesFilter.getInstance(sl2);/* 添加自定义事件响应* 单选效果*/tmptt.addEventFunc(checkchange,new SingleCheckFunc();/* 初始化选中过滤* 对满足initstack过滤器链的节点初始化选中*/tmptt.setInitCheckedSelector(initstack);/渲染树tmptt.render(); /合成树 员工、部门树 /* * 构造json数据合成器 */ var jo = new TreeAppendLeaf(); /* * 合成Json数据 */var xx = jo.toJoin(Ext.decode(treejson),Ext.decode(