ExtJS 3.3.0禁用保存按钮，直到组合框值

Question

我使用ExtJS 3.3.0，我想要禁用保存按钮，直到组合框中有一个值。

我创建组合框就像这样;

new Ext.form.ComboBox({ 
    id: this.idName + 'Combo_StateID', 
    name: 'StateID', 
    fieldLabel: 'State', 
    singleOnly: true, 
    typeAhead: true, 
    triggerAction: 'all', 
    store: StateStore, 
    mode: 'remote', 
    valueField: 'StateID', 
    hiddenField: 'StateID', 
    displayField: 'StateNumber', 
    lazyInit: false, 
    listClass: 'x-combo-list-small', 
    tpl: '<tpl for=\".\"><div class=\"x-combo-list-item\"><span style=\"width: 50px;\">#{StateNumber}</span></div></tpl>', 
}), ") . " 

我只是像这样创建按钮;

newPanel.addButton(
    { 
     iconCls:'icon-ok', 
     text: 'Save Data' 
    } 
) 

这一切工作正常。但禁用我无法想象的按钮。

我已经尝试了以下，但仍然没有;

listeners: { 
afterrender: function() { 
    if (this.getValue() === null) { 
    Ext.getCmp('yourButton').setDisabled(true); 
     } 
    else { 
     Ext.getCmp('yourButton').setDisabled(false); 
     } 
    } 
} 

任何帮助，将不胜感激

Answer 1

正如你已经使用afterrender将火灾组件渲染完成后。

尝试使用ExtJS Combobox

我已经创建了一个演示的选择方法。在这里你检查它是如何工作Sencha fiddle

Ext.onReady(function() { 
    var PanelMain = Ext.extend(Ext.Panel, { 
      title: 'My Panel', 
      initComponent: function() { 
       Ext.applyIf(this, { 
        items: [{ 
         xtype: 'combo', 
         typeAhead: true, 
         triggerAction: 'all', 
         lazyRender: true, 
         mode: 'local', 
         store: new Ext.data.ArrayStore({ 
          id: 0, 
          fields: [ 
           'myId', 
           'displayText' 
          ], 
          data: [ 
           [1, 'item1'], 
           [2, 'item2'] 
          ] 
         }), 
         valueField: 'myId', 
         displayField: 'displayText', 
         editable: false, 
         listeners: { 
          select: function (combo, record) { 
           Ext.getCmp('saveButton').setDisabled(false); 
          } 
         } 
        }, { 
         xtype: 'button', 
         id: 'saveButton', 
         iconCls: 'icon-ok', 
         disabled: true, 
         text: 'Save Data', 
         handler: function() { 
          //here you can put your logic.. 
         } 
        }] 
       }); 
       PanelMain.superclass.initComponent.call(this); 
      } 
     }), 
     panel = new PanelMain({ 
      renderTo: Ext.getBody() 
     }); 

});