Блог

Я использую панель (скажем, parentPanel), имеющую другую дочернюю панель (скажем, childPanel). Как я могу запустить пользовательское событие из дочерней панели, которое будет перехвачено parentPanel?

Вот так:

 Ext.define('Ext.ux.form.Panel', {
    extend: 'Ext.form.Panel',
    title: 'Simple Form',
    bodyPadding: 5,
    width: 350,

    layout: 'anchor',
    defaults: {
        anchor: '100%'
    },

    defaultType: 'textfield',
    initComponent: function() {
        var me = this;
        me.items = [{
            fieldLabel: 'First Name',
            name: 'first',
            allowBlank: false
        }];
        me.callParent(arguments);
    },

    afterRender: function() {
        var me = this;
        me.callParent(arguments);
        // in case of a form you can also use the findField() method
        // I used down() because it will work with all sort of containers
        me.down('textfield[name=first]').on('change',me.onFirstnameChange,me);
    },

    onFirstnameChange: function(field) {
        // custom handler
    }
});
  

Выполнение этого только для отдельных экземпляров работает одинаково, ожидайте, что вам нужно будет использовать afterrender событие вместо статического метода шаблона.

Примечание: Если это не соответствует вашим потребностям, вам нужно будет опубликовать более подробный вопрос (с примером кода) для более подробного ответа.

Редактировать:

Добавление пользовательского события в новый компонент:

 initComponent: function() {
    // ...
    me.addEvents('customeventname');
    // ... 
}
  

теперь вы можете зарегистрировать прослушиватели для этих событий в экземплярах этого компонента и запустить событие, вызвав, fireEvent('customeventname', args) где args указаны аргументы, с которыми вы хотите вызвать каждого прослушивателя.