`
lmh2072005
  • 浏览: 114107 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

记录下用到的treecombobox

 
阅读更多

treecombobox.js

// JavaScript Document
Ext.namespace('Ext.ux');
(function() { 
    var createTreePanel = function(treeWidth, treeHeight, rootVisible, root) { 
        var treePanel = new Ext.tree.TreePanel({
            root : root, 
            rootVisible : rootVisible, 
            floating : true, 
            autoScroll : true, 
            renderTo : Ext.getBody(), 
            width : treeWidth || 150, 
            height : treeHeight || 250
        });
        return treePanel; 
    } 
 
    var createStore = function(treePanelId,storeBaseParams, storeMethod,dataUrl, storeRoot, storeTotalProperty) { 
        var store = new Ext.data.JsonStore( { 
            proxy : new Ext.data.HttpProxy( { 
                method : storeMethod || 'GET', 
                url : dataUrl 
            }), 
            baseParams : storeBaseParams || { 
                query : '', 
                start : 0 
            }, 
            root : storeRoot || 'data', 
            totalProperty : storeTotalProperty || "total", 
            fields : [0], 
            autoLoad : false, 
            load : function(options) { 
                options.callback = function() {
                    var TreeJsonRoot='data';
                    if(storeRoot!=undefined && storeRoot.length>0) TreeJsonRoot=storeRoot;
                        Ext.getCmp(treePanelId).root.removeAll(true);
                        if(storeRoot!=undefined && storeRoot.length>0){
                                    Ext.getCmp(treePanelId).root.appendChild(this.reader.jsonData);
                                }else{
                                    Ext.getCmp(treePanelId).root.appendChild(this.reader.jsonData[TreeJsonRoot]);
                            }
                }; 
                return Ext.data.JsonStore.superclass.load.call(this, options); 
            } 
        }) 
        return store; 
    } 
 
    Ext.ux.TreeComboBox = Ext.extend(Ext.form.TwinTriggerField,{
        initComponent : function() { 
            Ext.ux.TreeComboBox.superclass.initComponent.call(this); 
            this.on('specialkey', function(f, e) { 
                if (e.getKey() == e.ENTER) { 
                    this.onTrigger2Click(); 
                } 
            }, this);
            //this.on('keydown',this.filterTree,this);
            this.treePanel = createTreePanel(this.treeWidth, this.treeHeight,this.rootVisible, this.root); 
            //this.treePanel.hiddenPkgs=[];
            this.treePanel.on('hide', this.onTreeHide, this); 
            this.treePanel.on('show', this.onTreeShow, this); 
            this.treePanel.on('click', this.onTreeNodeClick, this);
            this.store = createStore(this.treePanel.id, this.storeBaseParams, 
            this.storeMethod, this.dataUrl, this.storeRoot,
            this.storeTotalProperty);            
           /* this.treePanel.getTopToolbar().addItem(new Ext.ux.form.SearchField( { 
                width : this.treeWidth ? this.treeWidth : 220, 
                store : this.store 
            }));*/
            //this.treePanel.getBottomToolbar().addItem(new Ext.PagingToolbar({store:this.store})); 
            this.resizer = new Ext.Resizable(this.treePanel.id, { 
                handles : 'se', 
                minWidth : 100, 
                minHeight : 80, 
                pinned : true 
            }); 
            this.mon(this.resizer, 'resize', function(r, w, h) { 
                this.treePanel.setSize(w, h); 
                //this.treePanel.getTopToolbar().get(0).setSize(w - 10, 18); 
            }, this); 
        }, 
        trigger1Class : 'x-form-clear-trigger', 
        onTrigger1Click : function() { 
            this.setRawValue(''); 
            this.setHiddenValue(''); 
        }, 
        onTrigger2Click : function() { 
            this.treePanel.show(); 
            this.treePanel.getEl().alignTo(this.wrap, 'tl-bl?'); 
        }, 
        editable : true, 
        storeAutoLoad : true, 
        frstLoad : true, 
        onTreeShow : function() { 
            Ext.getDoc().on('mousewheel', this.collapseIf, this); 
            Ext.getDoc().on('mousedown', this.collapseIf, this); 
            if (this.storeAutoLoad && this.frstLoad) { 
                this.store.load( {}); 
                this.frstLoad = false; 
            } 
        }, 
        onTreeHide : function() { 
            Ext.getDoc().un('mousewheel', this.collapseIf, this); 
            Ext.getDoc().un('mousedown', this.collapseIf, this); 
        }, 
        collapseIf : function(e) { 
            if (!e.within(this.wrap) && !e.within(this.treePanel.getEl())) { 
                this.collapse(); 
            } 
        }, 
        collapse : function() { 
            this.treePanel.hide(); 
        },
        showTree : function() { 
            this.treePanel.show(); 
        },
        validateBlur : function() { 
            return !this.treePanel || !this.treePanel.isVisible(); 
        }, 
        setValue : function(v) { 
            this.setRawValue(v); 
        }, 
        getValue : function() { 
            return this.getRawValue(); 
        }, 
        setHiddenValue : function(v) { 
            return this.hiddenField.value = v; 
        }, 
        getHiddenValue : function() { 
            return this.hiddenField.value; 
        }, 
        getHiddenId : function() { 
            return this.hiddenField.id; 
        }, 
        onTreeNodeClick : function(node, e) { 
            this.setRawValue(node.text); 
            this.hiddenField.value = node.id 
            this.fireEvent('select', this, node);
            if(this.emptyShow){
                if(this.getValue()!=''){
                    this.collapse();
                }
            }else{
                this.collapse(); 
            }
           
        }, 
        onRender : function(ct, position) { 
            Ext.ux.TreeComboBox.superclass.onRender.call(this, ct, 
                    position); 
            if (!this.hiddenField) { 
                this.hiddenField = this.getEl().insertSibling( { 
                    tag : 'input', 
                    type : 'hidden', 
                    name : this.name, 
                    value : this.hiddenValue, 
                    id : (this.hiddenId || this.name) 
                }, 'before', true); 
                this.getEl().dom.removeAttribute('name'); 
            } 
        },
        filterTree: function(t, e){
            var text = t.getValue();
            Ext.each(this.treePanel.hiddenPkgs, function(n){
                n.ui.show();
            });
            if(!text){
                this.treePanel.filter.clear();
                return;
            }
            this.treePanel.expandAll();
            var re = new RegExp('^' + Ext.escapeRe(text), 'i');
            this.treePanel.filter.filterBy(function(n){
                return !n.attributes.isClass || re.test(n.text);
            });
            // hide empty packages that weren't filtered
            this.treePanel.hiddenPkgs = [];
            var me = this.treePanel;
            this.treePanel.root.cascade(function(n){
                if(!n.attributes.isClass && n.ui.ctNode.offsetHeight < 3){
                    n.ui.hide();
                    me.hiddenPkgs.push(n);
                }
            });
        }
 
    }); 
})(); 
Ext.reg('treecombobox',Ext.ux.TreeComboBox);

 

 

//调用

               xtype:'treecombobox',
                name:'corp',
                id:'Name',
                storeRoot:"data",
                storeTotalProperty:"total", 
                dataUrl:"/ah/tree", 
                root:new Ext.tree.TreeNode({
                }),
                listeners:{
                    "select":function(node,e){

                    }
                }

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics