ext2下拉树选项框comboxWithTree(支持异步加载子节点）

来源：互联网发布：方正手机炒股软件编辑：程序博客网时间：2024/05/01 09:28

ext版本：2.2

简介：支持单选、异步加载子节点（当然一下子拼接好全部节点的json也是绝对没问题的），要支持多选则需要自行设置，(已测试通过)浏览器兼容ie8、谷歌、FF。

资料参考：搜索一下“ext2 下拉树”，应该有一大堆内容代码介绍完全一样的博文，下面代码就是取自那堆“原创”的博文，不能说明出处，望原作者见谅。本代码在那个基础上有较好的修改：1、修改tree的lorder使tree支持异步加载子节点；2、使下拉树由多选转为单选。

代码如下：

//区域下拉树(ext2)var comboxWithTree = new Ext.form.ComboBox({        fieldLabel:'区域',      id:'zonename', //hiddenName:'zonename',    displayField:'code',valueField:'value',mode:'local',      store:new Ext.data.SimpleStore({fields:[],data:[[]]}),         editable:false,         shadow:false,         triggerAction:'all',         maxHeight: 200,       anchor:'98%',    tpl:"<div style='height:200px'><div id='tree4combox'></div></div>"  });  var treelorder =  new Ext.tree.TreeLoader({ dataUrl : fullpath+'/systemextend/UserZoneAction!listUserZoneTree4combo.do'});treelorder.on("beforeload",function(treeloader,node){ treelorder.baseParams.comboTreeid = node.attributes.id; },treelorder); var tree4combox = new Ext.tree.TreePanel({      border : true,      rootVisible : true,      root : {        text:'全国',id:'-1',expanded : true    },    loader : treelorder});  tree4combox.on('click',function(node){     //点击选中comboxWithTree.setValue(node.text);  comboxWithTree.collapse();  });     tree4combox.on('checkchange',function(node,checked ){  //勾选复选框选中并清空复选框if(checked==true){node.getUI().toggleCheck(false);     comboxWithTree.setValue(node.text); comboxWithTree.collapse();   }});comboxWithTree.on('expand',function(){         tree4combox.render('tree4combox');     });

由于该下拉树是基于ext2的，对于ext3应该可以兼容过去，但是要在ext4上使用恐怕要阔斧大刀。ext4的下拉树控件可参考我的另一篇文章，贴上地址：

http://blog.csdn.net/seedingly/article/details/19168721

2 0