Jak odwołać obiekt kontenerowy przodka z kontrolki ExtJS?

Question

Używam ExtJS do budowania okna zawierającego kilka paneli jako elementy. Jeden z tych paneli zawiera przycisk.

Chcę dołączyć do przycisku obsługę przycisku, tak że po kliknięciu przycisku mogę ukryć okno zawierające wyżej wymienione panele i ten przycisk.

Moje pytanie brzmi: jak mogę uzyskać odniesienie do okna nadrzędnego mojego przycisku BEZ odwoływania się do okna po identyfikatorze? Dosłownie chcę odwołać się do instancji Ext.Window, a nie do instancji Ext.Panel, która zawiera mój przycisk.

Uwaga: Nie chcę odwoływać się do okna przez id, ponieważ jestem podklasy klasy Ext.Window, a zatem identyfikator okna nie zawsze będzie taki sam. Krótko mówiąc, tworzę klasę Kreatora, a kiedy klikam przycisk Anuluj kreatora, chcę ukryć okno kreatora zawierające przycisk.

Oto mój kod:

var newWizardWindow = new WizardWindow({ 
    id: 'newWizardWindow', 
    title: 'New', 
    items: [ 
    ... 
    ], 
    buttons: [{ 
    text: 'Cancel', 
    handler: function() { 
     // REFERENCE WizardWindow instance here. 
    } 
    },{ 
    id: 'newWizardPreviousButton', 
    text: '« Previous', 
    disabled: true, 
    handler: newWizardNavigator.createDelegate(this, [-1]) 
    },{ 
    id: 'newWizardNextButton', 
    text: 'Next »', 
    handler: newWizardNavigator.createDelegate(this, [1]) 
    }], 
    listeners: { 
    … 
    } 
}); 

Oto kilka pomysłów mam wymyślić w miarę jak ukryć okno:

1. this.ownerCt.ownerCt (to jest przycisk). Niezbyt korzystne, ponieważ przy przyszłej aktualizacji do ExtJS liczba rodziców między oknem a przyciskiem może się zmienić.
2. W pewien sposób przechowuj odwołanie do instancji WizardWindow w klasie WizardWindow.
3. Znajdź najbliższą klasę WizardWindow [CSS] w modzie jQuery: $ (this) .closest ('. WizardWindow'). Może this.findByParentType ("WizardWindow")?

Answer 1

Co powiesz na wypróbowanie metody findParentByType(...)? Pamiętam, że używam go kilka razy.

findParentByType ( ŁAŃCUCH/Ext.Component/klasa xtype, [logiczna płytkie]): Ext.Container

Znajdź pojemnika powyżej komponentu na każdym poziomie przez xtype lub klasy.

Tutaj można używać xtype zamiast id jako odniesienie i xtype jest taka sama bez względu na to co masz przykład tego typu.

buttons: [{ 
    text: 'Cancel', 
    handler: function() { 
     // REFERENCE WizardWindow instance here. 
     var parentWindow = this.findParentByType('xtypelizardwindow'); 
    } 
}] 

Answer 2

W konfiguracji swojego przycisku, jako rodzeństwa dla własności obsługi, można dodać zakres: właściwość newWizardWindow? Nie jestem w 100% pewien, czy to zadziała, ale myślę, że tak będzie. Spowoduje to ustawienie zakresu twojej obsługi przycisku jako okna, a wewnątrz funkcji handler'a możesz to zrobić.hide();

Answer 3

Możesz przekazać ref jako zakres.

 
buttons: [{ 
    text: 'Cancel', 
    scope:this, 
    handler: function() { 
    } 
}] 

Answer 4

this.ownerCt będzie również zawierał odniesienie do obiektu nadrzędnego, który jest kontenerem. , ponieważ używa tego.findParentByType (rodzic xtype)