extjs4 TreePicker下拉树用法

       项目中需要用下拉树来展示数据，到网上搜了下没有想要的东西，有些是自己写的下拉树，官方的api也没有treeCombobx这样的东西，但是在extjs4源码包里面却有一个叫treePicker的东西，这正是官方提供的下拉树，但是api里面也没有使用的例子。网上也没有相关的用法，没办法，只有自己看源码慢慢摸索，好在最后终于摸索出来了。

{  
    xtype : 'treepicker',  
    displayField : 'text',//这个地方也需要注意一下，这个是告诉源码tree用json数据里面的什么字段来显示，我测试出来是只能写'text'才有效果  
    fieldLabel : '移动到的部门',  
    forceSelection : true,// 只能选择下拉框里面的内容  
        editable : false,// 不能编辑  
    store : deptSt  //这个store必须是在controller里面动态创建出来的，如果用引入controller时加载的那种store会报错  
}  

       配置跟combobox差不多哦，需要注意的地方就是displayField和store的字段的配置，其他都没有什么大问题

 

 

      在controller里面动态创建treeStore的方法：

createTreeSt : function(url) {  
    var store = Ext.create('Ext.data.TreeStore', {  
                proxy : {  
                    type : 'ajax',  
                    url : url  
                },  
                // 设置根节点  
                root : {  
                    text : '',  
                    id : 'root'  
                }  
            });  
    return store;  
}  

      这样效果就出来了，treePicker.js在extjs4的包里面就有

评论

6 楼 jerry 2014-03-12  

这个树，最大的缺憾是不能多选。

5 楼 pig3d2 2014-02-16  

在编辑的时候，前台默认选中这个值，是怎么做的？？楼主

4 楼 chen2991101 2013-07-21  

不用加事件

3 楼 童梦新苑 2013-07-17  

就是能显示出来数据， 但是不能选择；  是不是要加什么选择事件

2 楼 chen2991101 2013-07-14  

代码似乎没什么问题，我的这么写是没有问题的

1 楼 童梦新苑 2013-07-11  

怎么我的显示出来了   并且有数据， 但是就是不能选择是怎么回事啊；

id:"treecomboid",
									xtype: 'treepicker',
									width:180,
									displayField:"text",
							        //valueField:"kscode",
							        editable : false,
									forceSelection : true,// 
									store:Ext.create('Ext.data.TreeStore', {  
								        root: { 
								            text: '', 
								            expanded: true 
								        }, 
								        proxy: {  
								            type: 'ajax',  
								            url: "<%=request.getContextPath()%>/reportQuery/ReportQueryAction.do?method=getKsData"
								        } 
								    })