Ext.ComboBox tree

最新推荐文章于 2020-12-23 08:22:04 发布

相太阳

最新推荐文章于 2020-12-23 08:22:04 发布

阅读量80

点赞数

原文链接：http://www.cnblogs.com/shenjk/archive/2010/05/25/1743579.html

版权

http://www.webexpoer.com/

代码

Ext.form.ComboBoxTree = Ext.extend(Ext.form.ComboBox, {
    store: new Ext.data.SimpleStore({ fields: [], data: [[]] }),
    editable: false ,
    shadow: false ,
    mode: ' local ' ,
    triggerAction: ' all ' ,
    maxHeight: 200 ,
    selectedClass: '' ,
    onSelect: null ,
    canCollapse: true ,
    constructor: function(_cfg) {
         if (_cfg == null ) {
            _cfg = {};
        }
        Ext.apply( this , _cfg);
         this .treerenderid = Ext.id();
         this .tpl = String.format( ' <tpl for="."><div style="height:200px"><div id="ext-combobox-tree{0}"></div></div></tpl> ' , this .treerenderid);
        Ext.form.ComboBoxTree.superclass.constructor.apply( this , arguments);
         if ( this .tree) {
            var cmb = this ;
             this .tree.on( ' click ' , function(node) {
                cmb.canCollapse = false ;
                 if (node.isLeaf()) {
                    cmb.canCollapse = true ;
                     if (Ext.isFunction(cmb.onSelect)) {
                        cmb.onSelect(cmb, node);
                    } else {
                        cmb.setValue(node.text);
                    } cmb.collapse();
                }
            });
             // 以下事件，让combobox能正常关闭
             this .tree.on( ' expandnode ' , function() { cmb.canCollapse = true ; });
             this .tree.on( ' beforeload ' , function() { cmb.canCollapse = false ; });
             this .tree.on( ' beforeexpandnode ' , function() { cmb.canCollapse = false ; });
             this .tree.on( ' beforecollapsenode ' , function() { cmb.canCollapse = false ; });
        }
         this .on( ' expand ' , this .expandHandler, this );
         this .on( ' collapse ' , this .collapseHandler, this );
    },
    expandHandler: function expand() {
         this .canCollapse = true ;
         if ( this .tree) {
             this .tree.render( ' ext-combobox-tree ' + this .treerenderid);
             this .canCollapse = true ;
             this .tree.getRootNode().expand();

        }
    },
    collapseHandler: function collapse() {
         if ( ! this .canCollapse) {
             this .expand();
        }
    }

});

示例：

http://www.webexpoer.com/

代码

new Ext.form.ComboBoxTree({
            tree: new Ext.tree.TreePanel({
                root: new Ext.tree.AsyncTreeNode({ text: ' --选择-- ' , id: ' 0 ' }),
                rootVisible: false ,
                border: false ,
                dataUrl: ' /AreaList.aspx ' ,
                listeners: {
                    beforeload: function (n) { if (n) { this .getLoader().baseParams.id = n.attributes.id; } }
                }
            }) /* ,
            onSelect: function(cmb, node) {
                alert(node.attributes.text);
            } */
        })

转载于:https://www.cnblogs.com/shenjk/archive/2010/05/25/1743579.html