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

雨点打透心脏的1/2处 2022-08-21 11:58 117阅读 0赞

原文：[extjs2下拉树选项框comboxWithTree(支持异步加载子节点）][extjs2_comboxWithTree]

源代码下载地址：[http://www.zuidaima.com/share/1782292526681088.htm][extjs2_comboxWithTree]

extjs版本：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');
    
    });

[extjs2_comboxWithTree]: http://www.zuidaima.com/share/1782292526681088.htm