Definieren Sie die Zuhörer in ExtJS controller

Hab ich die tabpanel - es ist die main Formular (Ansicht).
In diesem tabpanel definiere ich die verschiedenen tabs - xtype:'panel'.

So, ich habe eine main(controller) , main anzeigen und einige Registerkarten-Ansichten.
Die Registerkarte Ansichten, auf die verwiesen werden in main anzeigen.

Möchte ich definieren Zuhörer activate Veranstaltung einiger Kindes panel im main controller.

Wie kann ich das tun?

den main controller :

Ext.define('KP.controller.account.apartment.Main', {
    extend: 'Ext.app.Controller',

    views: ['account.apartment.Main',
        'account.apartment.Requisites'
    ],

    models: ['account.apartment.Requisites'
    ],
    stores: ['account.apartment.Requisites'
    ],


    init: function () {

    }
});

Den main anzeigen:

Ext.define('KP.view.account.apartment.Main', {
    extend: 'Ext.window.Window',
    alias: 'widget.ApartmentData',

    height: 566,
    width: 950,
    activeItem: 0,
    layout: {
        type: 'fit'
    },
    autoShow: false,

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {            
            items: [
                {
                    xtype: 'tabpanel',
                    activeTab: 0,
                    deferredRender: true, 

                    items: [                        

                        {
                            xtype: 'RequisitesApartment'
                        }
                    ]
                }
            ]
        });

        me.callParent(arguments);
    }

});

Dem Kind panel RequisitesApartment (view):

Ext.define('KP.view.account.apartment.Requisites', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.RequisitesApartment',


    id: 'panel_accountrequisites',
    height: 350,
    width: 1124,
    autoScroll: true,
    layout: {
        type: 'fit'
    },


    listeners: {
        activate: function () {           
               ....load data....
               ...this listeners I want to push in 'main' controller...            
        }
    },

    initComponent: function () {
        var me = this;

        var grid_store = Ext.create('KP.store.account.apartment.Requisites');

        Ext.applyIf(me, {
            dockedItems: [
                {
                    xtype: 'gridpanel',
                    height: 260,
                    autoScroll: true,
                    dock: 'bottom',
                    store: grid_store,
                    id: 'r_gridFlatParams',
                    forceFit: true,


                    columns: [
                        ...some columns....
                    ],
                    viewConfig: {
                }
            }
            ]
        });

        me.callParent(arguments);
    }
});

InformationsquelleAutor Oleg | 2012-09-21

7

Registrieren direkt als Kontrolle innerhalb der zuständigen controller

Hier ist ein Beispiel mit einer Abfrage. Für Sie sicher, nur müssen Sie die Abfrage, aber ich denke, es ist ein gutes Beispiel. Die custom cfg Eigenschaft ident machen Sie es einfach finden Sie jede Registerkarte. Wie im Beispiel unten müssen Sie angeben tabConfig in jedem panel und definieren Sie die ident-es.
```
Ext.create('Ext.tab.Panel', {
    width: 400,
    height: 400,
    renderTo: document.body,
    items: [{
        title: 'Foo',
        tabConfig: {
            ident: 'foo'
        },
    }, {
        title: 'Bar',
        tabConfig: {
            ident: 'bar',
            title: 'Custom Title',
            tooltip: 'A button tooltip'
        }
    }]
});

console.log(Ext.ComponentQuery.query('tabpanel tabbar tab[ident=foo]')[0]);
console.log(Ext.ComponentQuery.query('tabpanel tabbar tab[ident=bar]')[0]);
```
Andere Möglichkeit ist die Verwendung von css-id ' s abgefragt werden kann wie '#my-name' aber ich empfehle die Verwendung eines benutzerdefinierten man wie im obigen Beispiel
- edit getan. Mit diesem Beispiel haben Sie direkten Zugriff auf jede Registerkarte
- In 'main'(controller) ich Schreibe : dies.Kontrolle({ 'ApartmentData tabpanel-tabbar-Registerkarte[ident=foo]': { aktivieren: Funktion (grid) { console.log('parampampam'); } } }); - Aber es wird nicht funktionieren(
- Ersten; Sie schreiben sollen widgets in Kleinbuchstaben und nur Klassennamen in camelcase. Zweitens: haben Sie angewendet, tabConfig zusammen mit xtype: 'RequisitesApartment'? Das Beispiel oben kann kopiert werden in eine der Beispiel-code-Felder innerhalb der sencha-API.
InformationsquelleAutor sra
3

Gut, sollte ich diesen code in "main" (controller):
```
 this.control({
        'ApartmentData tabpanel RequisitesApartment': {
            activate: function () {
                console.log('hello!');                
            }
        }
    });
```
War das problem in falschen Selektor, die ich verwendet.
Der korrekte Selektor ist :
```
 'ApartmentData tabpanel RequisitesApartment'
```
Gibt 'ApartmentData'(definieren, wie ein alias: 'widget.ApartmentData') - ist das 'Fenster' xtype -die wichtigste form.
tabpanel - panel mit Registerkarten im 'Fenster' und 'apartServList'(definieren wie alias: 'widget.RequisitesApartment') - das einige-panel.

Danke für sra!
- Gut, apartServList kann nicht gefunden werden in deinem Beispiel-code. So wird es ein bisschen schwer für andere, warum diese Antwort richtig ist. Mich eingeschlossen. Vielleicht könnten Sie Bearbeiten Ihre Frage.
- Und bitte beachten Sie, dass mein Beispiel verweist Sie auf die tab-Taste selbst, nicht auf der Registerkarte. Soweit ich weiß ist das activate-Ereignis der Registerkarte wird nicht gequasselt, um die Systemsteuerung, ist es nicht?
- Ich bearbeitet meine Antwort, in der 'Systemsteuerung' xtype haben den "aktivieren" - Ereignis .
InformationsquelleAutor Oleg
0

die richtige Sache zu tun ist, um pass eine Konfiguration Objekt an die member-Funktion Kontrolle in controller init Funktion. Aus Sencha-Dokumentation : Die control-Funktion macht es leicht, hören Sie Ereignisse auf Ihrem view-Klassen und etwas Unternehmen, mit einem handler-Funktion.

Ein Beispiel, gerade von extjs docs:
```
Ext.define('MyApp.controller.Users', {
extend: 'Ext.app.Controller',

init: function() {
    this.control({
        'viewport > panel': {
            render: this.onPanelRendered
        }
    });
},

onPanelRendered: function() {
    console.log('The panel was rendered');
}
});
```
Hoffe, das hilft.
Cheers
- Wie wir hinzufügen können mehrere listener für einen Shop innerhalb des controller-Datei? var ps = dieses.getMyStore(); ps.auf({ beforesync : dies.beforesync, finishupdate : dies.finishupdate, finishedWriting: dies.finishedWriting, scope: this });
InformationsquelleAutor r366y

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.