Extjs 4自定義組合框佈局錯誤

我想自定義組合框到網格面板的選擇器。我有一個我無法解決的UI錯誤。當我把組合框放在fieldbox的hbox佈局中並嘗試搜索時，選擇器彈出的高度應該是。Extjs 4自定義組合框佈局錯誤

enter image description here

如果我尋找第二次 - 它正確的位置上奇蹟般地彈出。之後，每次都是正確的。

enter image description here

有什麼問題，可以做些什麼來解決這個問題？

這是組合定義

Ext.define('NG.ux.form.field.GridComboBox', { 
    extend: 'Ext.form.field.ComboBox', 
    alias: 'widget.gridcombobox', 
    minChars: 3, 
    fieldLabel: 'Choose Search', 
    displayField: 'name', 
    valueField: 'id', 
    typeAhead: false, 
    anchor: '100%', 
    pageSize: 10, 
    autoSelect: false, 
    // copied from ComboBox 
    createPicker: function() { 
     var me = this, 
      picker, 
      pickerCfg = Ext.apply({ 
       xtype: 'gridpanel', 
       pickerField: me, 
       selModel: { 
        mode: me.multiSelect ? 'SIMPLE' : 'SINGLE' 
       }, 
       floating: true, 
       hidden: true, 
       ownerCt: me, 
       store: me.store, 
       displayField: me.displayField, 
       focusOnToFront: false, 
       tpl: me.tpl 

      }, me.listConfig, me.defaultListConfig); 

     picker = me.picker = Ext.widget(pickerCfg); 

     me.mon(picker, { 
      itemclick: me.onItemClick, 
      refresh: me.onListRefresh, 
      scope: me 
     }); 

     me.mon(picker.getSelectionModel(), { 
      beforeselect: me.onBeforeSelect, 
      beforedeselect: me.onBeforeDeselect, 
      selectionchange: me.onListSelectionChange, 
      scope: me 
     }); 
     return picker; 
    }, 


    listConfig: { 
     loadingText: 'Searching...', 
     emptyText: 'No matching posts found.', 
     hideHeaders: true, 
     features: [ 
     { 
      ftype: 'grouping', 
      groupHeaderTpl: '{name}', 
      collapsible: false 
     }], 
     height: 100, 
     columns: [ 
      { 
       header: 'Name', 
       dataIndex: 'name', 
       flex: 1 
      } 
     ] 
    }, 

    initComponent: function() { 

     this.callParent(arguments); 
    } 
});

這是一個佈局定義

var states = Ext.create('Ext.data.Store', { 
    fields: ['id', 'name', 'category'], 
    data: [ 
     { "id": "AL", "name": "Alabama","category":"1" }, 
     { "id": "AK", "name": "Alaska", "category": "2" }, 
     { "id": "AZ", "name": "Arizona", "category": "2" } 

    ] 
}); 

Ext.define('NG.view.search.GeneralSearch', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.generalsearch',  
    store: states, 
    requires: [ 
     'NG.ux.form.field.GridComboBox' 
    ], 
    title: 'Search',   
    initComponent: function() { 
     this.createItems(); 

     this.callParent(arguments); 
    }, 

    createItems: function() { 
     this.items = [{ 
      xtype: 'fieldcontainer', 
      layout: 'hbox', 
      items: [{ 
       xtype: 'gridcombobox',      
       store: states, 
       hideTrigger: true, 
       hideLabel: true, 
       listeners: { 
        scope: this, 
        select: function (arg1, arg2, arg3) { 
         this.fireEvent('select', arg1, arg2, arg3); 
        } 
       } 
      }, { 
       xtype: 'button', 
       text: 'one', 
       scale: 'small' 
      }, { 
       xtype: 'button', 
       text: 'two', 
       scale: 'small' 
      }] 

     }]; 

    } 
});

來源

2013-06-25 Polina F.

升級從內線到4.2.0分機4.2.1.883的問題得到了解決

後

來源

2013-06-26 05:40:09

Extjs 4自定義組合框佈局錯誤

回答

相關問題