extjs tree下拉列表_Ext TreeCombo 树形 下拉框

参考:http://www.extjs.com/forum/showthread.php?38654-Tree-in-a-Combo./page4

在别人基础上稍作修改

1.添加hiddenName，使传值时跟Ext.form.ComboBox类似;

2.设值时展开整棵树(在TreeCombo外实现)，使弹出下拉框时默认选中节点;

代码如下:

/**

* @version Base on Ext3.0

* @class Ext.ux.TreeCombo

* @extends Ext.form.TriggerField

*/

Ext.ux.TreeCombo = Ext.extend(Ext.form.TriggerField, {

// triggerClass: 'x-form-tree-trigger',

initComponent : function() {

this.readOnly = true;

Ext.ux.TreeCombo.superclass.initComponent.call(this);

this.on('specialkey', function(f, e) {

if (e.getKey() == e.ENTER) {

this.onTriggerClick();

}

}, this);

this.getTree();

},

onTriggerClick : function() {

this.getTree().show();

this.getTree().getEl().alignTo(this.wrap, 'tl-bl?');

},

getTree : function() {

if (!this.treePanel) {

if (!this.treeWidth) {

this.treeWidth = Math.max(150, this.width || 200);

}

if (!this.treeHeight) {

this.treeHeight = 200;

}

this.treePanel = new Ext.tree.TreePanel({

renderTo : Ext.getBody(),

loader : this.loader || new Ext.tree.TreeLoader({

preloadChildren : (typeof this.root == 'undefined'),

url : this.dataUrl || this.url

}),

root : this.root || new Ext.tree.AsyncTreeNode({

children : this.children

}),

rootVisible : (typeof this.rootVisible != 'undefined')

? this.rootVisible

: (this.root ? true : false),

floating : true,

autoScroll : true,

minWidth : 200,

minHeight : 200,

width : this.treeWidth,

height : this.treeHeight,

listeners : {

hide : this.onTreeHide,

show : this.onTreeShow,

click : this.onTreeNodeClick,

expandnode : this.onExpandOrCollapseNode,