Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Mar 2010
    Posts
    19
    Vote Rating
    1
    dietmar is on a distinguished road

      1  

    Default ComboBox using Grid instead of BoundList

    ComboBox using Grid instead of BoundList


    It would be nice to use a Grid instead of simple BoundList to render the ComboBox picker. This is currently not possible.

    I currently use the following code to implement that feature. Maybe it is possible to integrate that into the standard ComboBox in future releases?

    Code:
    Ext.define('PVE.form.ComboGrid', {
        extend: 'Ext.form.ComboBox',
        requires: [
    	'Ext.grid.Panel'
        ],
        alias: ['widget.PVE.form.ComboGrid'],
    
        // copied from ComboBox 
        createPicker: function() {
            var me = this,
            picker,
            menuCls = Ext.baseCSSPrefix + 'menu',
            opts = Ext.apply({
                selModel: {
                    mode: me.multiSelect ? 'SIMPLE' : 'SINGLE'
                },
                floating: true,
                hidden: true,
                ownerCt: me.ownerCt,
                cls: me.el.up('.' + menuCls) ? menuCls : '',
                store: me.store,
                displayField: me.displayField,
                focusOnToFront: false,
                pageSize: me.pageSize
            }, me.listConfig, me.defaultListConfig);
    
    	// NOTE: we simply use a grid panel
            //picker = me.picker = Ext.create('Ext.view.BoundList', opts);
    	picker = me.picker = Ext.create('Ext.grid.Panel', opts);
    
    	// hack: pass getNode() to the view
    	picker.getNode = function() {
    	    picker.getView().getNode(arguments);
    	};
    
            me.mon(picker, {
                itemclick: me.onItemClick,
                refresh: me.onListRefresh,
                scope: me
            });
    
            me.mon(picker.getSelectionModel(), {
                selectionChange: me.onListSelectionChange,
                scope: me
            });
    
            return picker;
        }
    });

  2. #2
    Sencha User
    Join Date
    Jun 2010
    Posts
    31
    Vote Rating
    0
    nailuo is on a distinguished road

      0  

    Default


    how use it??? and can tree in it?? how ?thank you very much

  3. #3
    Sencha User
    Join Date
    Mar 2010
    Posts
    19
    Vote Rating
    1
    dietmar is on a distinguished road

      0  

    Red face


    Quote Originally Posted by nailuo View Post
    how use it??? and can tree in it?? how ?thank you very much
    Just use it like a normal ComboBox - pass grid options in 'listConfig', for example:

    Code:
    { 
        xtype: 'PVE.form.ComboGrid',
        valueField: 'name',
        displayField: 'name',
        store: yourstore,
        listConfig: {
           columns: [
               {
               header: 'Name',
               dataIndex: 'name',
               }
           ]
        }
    }

  4. #4
    Sencha User atian25's Avatar
    Join Date
    Oct 2008
    Location
    china
    Posts
    114
    Vote Rating
    2
    atian25 is on a distinguished road

      0  

    Default


    should post as an extension.
    so by this way, combotree is coming
    @from: china
    @web: http://atian25.iteye.com
    @extensions: (extjs 4.x)
    * Ext.ux.grid.plugin.RowEditing - add some usefull features (v1.4 updated 2011-09-11)
    * Ext.ux.button.AutoRefresher
    * Ext.ux.form.field.DateTime

  5. #5
    Sencha User
    Join Date
    Jun 2010
    Posts
    31
    Vote Rating
    0
    nailuo is on a distinguished road

      0  

    Default


    how tree in it?????? i try it by your way.... but hava many errors ..............can you help me ,please

  6. #6
    Sencha User
    Join Date
    Mar 2010
    Posts
    19
    Vote Rating
    1
    dietmar is on a distinguished road

      0  

    Default


    sorry, I just use the normal grid (no tree).

  7. #7
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,791
    Vote Rating
    599
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    I don't think this is something we'll implement in the core, it's pretty simple to make your own field that extends field.Picker to contain any type of item as the list. The combo contains things specific to just single values.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  8. #8
    Sencha User
    Join Date
    Jun 2011
    Posts
    6
    Vote Rating
    2
    chenjinglys is on a distinguished road

      2  

    Default


    extjs4 added limitations on the variables, with adjustment of the range of roles in
    PHP Code:
    Ext.require(['Ext.tree.*''Ext.data.*''Ext.window.MessageBox']);

    Ext.define("Ext.ux.comboboxtree", {
        
    extend "Ext.form.field.Picker",
        
    requires : ["Ext.tree.Panel"],
        
    initComponent : function() {
            var 
    self this;
            
    Ext.apply(self, {
                
    fieldLabel self.fieldLabel,
                
    labelWidth self.labelWidth
                    
    // pickerAlign : "tl"//悬浮到其上面
                
    });
            
    self.callParent();
        },
        
    createPicker : function() {
            var 
    self this;
            var 
    store Ext.create('Ext.data.TreeStore', {
                        
    proxy : {
                            
    type 'ajax',
                            
    url self.storeUrl
                        
    },
                        
    sorters : [{
                                    
    property 'leaf',
                                    
    direction 'ASC'
                                
    }, {
                                    
    property 'text',
                                    
    direction 'ASC'
                                
    }]
                    });
            
    self.picker = new Ext.tree.Panel({
                        
    height 300,
                        
    autoScroll true,
                        
    floating true,
                        
    focusOnToFront false,
                        
    shadow true,
                        
    ownerCt this.ownerCt,
                        
    useArrows true,
                        
    store store,
                        
    rootVisible false
                    
    });
            
    self.picker.on({
                        
    beforehide : function(p) {
                            var 
    records self.picker.getView().getChecked(), names = [];
                            
    Ext.Array.each(records, function(rec) {
                                        
    names.push(rec.get('text'));
                                    });
                            
    // Ext.MessageBox.show({
                            // title : 'Selected Nodes',
                            // msg : names.join('<br />'),
                            // icon : Ext.MessageBox.INFO
                            // });
                            // alert(names.join(','));
                            
    self.setValue(names.join(','));
                            
    p.setVisible(true);// 隐藏树
                        
    }
                    });
            return 
    self.picker;
        },
        
    alignPicker : function() {
            
    // override the original method because otherwise the height of
            // the treepanel would be always 0
            
    var me thispickerisAboveaboveSfx '-above';
            if (
    this.isExpanded) {
                
    picker me.getPicker();
                if (
    me.matchFieldWidth) {
                    
    // Auto the height (it will be constrained by min and
                    // max width) unless there are no records to display.
                    
    picker.setWidth(me.bodyEl.getWidth());
                }
                if (
    picker.isFloating()) {
                    
    picker.alignTo(me.inputEl""me.pickerOffset);// ""->tl
                    // add the {openCls}-above class if the picker was
                    // aligned above
                    // the field due to hitting the bottom of the viewport
                    
    isAbove picker.el.getY() < me.inputEl.getY();
                    
    me.bodyEl[isAbove 'addCls' 'removeCls'](me.openCls
                            
    aboveSfx);
                    
    picker.el[isAbove 'addCls' 'removeCls'](picker.baseCls
                            
    aboveSfx);
                }
            }
        }
    });
    Ext.onReady(function() {
                var 
    com Ext.create("Ext.ux.comboboxtree", {
                            
    storeUrl 'check-nodes.json',
                            
    width 270,
                            
    fieldLabel '行政区划',
                            
    labelWidth 60,
                            
    renderTo 'tree-div'
                        
    });
            }); 

  9. #9
    Sencha Premium Member ajaxvador's Avatar
    Join Date
    Nov 2007
    Location
    PARIS, FRANCE
    Posts
    206
    Vote Rating
    0
    ajaxvador is on a distinguished road

      0  

    Default


    nice job
    Vador

  10. #10
    Sencha User
    Join Date
    Sep 2010
    Posts
    17
    Vote Rating
    0
    israel.galan is on a distinguished road

      0  

    Default


    This is great stuff. I see that the TreeStore cannot be filtered. Is there any way we could filter the tree view as the user types into the field text box?

Similar Threads

  1. Replies: 3
    Last Post: 9 May 2011, 1:23 AM
  2. [CLOSED] Combobox in GXT 2.1
    By amotamed in forum Ext GWT: Bugs (2.x)
    Replies: 1
    Last Post: 6 Jan 2010, 5:06 AM
  3. [OPEN] [2.2][DUP][CLOSED] ComboBox in IE
    By JamesMa in forum Ext 2.x: Bugs
    Replies: 3
    Last Post: 28 Sep 2008, 4:28 AM
  4. Replies: 2
    Last Post: 20 Oct 2007, 7:50 AM

Thread Participants: 17

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi