ExtJS 3.3.0 Désactiver le bouton Enregistrer jusqu'à ce que la liste déroulante ait la valeur

Question

J'utilise ExtJS 3.3.0 et je veux désactiver le bouton de sauvegarde jusqu'à ce qu'il y ait une valeur dans la liste déroulante. Je crée la zone de liste déroulante comme si; Je crée simplement le bouton comme ça;

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

Tout cela fonctionne très bien. mais en désactivant le bouton je ne peux pas comprendre du tout.

J'ai essayé ce qui suit, mais toujours rien;

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

Toute aide serait grandement appréciée

Answer 1

Comme vous l'avez utilisé afterrender il déclenche après le rendu des composants est terminée.

Essayez d'utiliser la méthode de sélection de ExtJS Combobox

J'ai créé une démo. Vous vérifiez ici comment il fonctionne 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() 
     }); 

});