Charles Candy
Charles Candy

Reputation: 27

EXTJS accessing component Layers of Event

I found that if a component 1 contain component 2 and in component 2 contain component 3 controller -> panel 1 -> panel 2 -> combobox

in combobox once data load I fire load event . in order to get that load event from controller I write

    this.panel1.panel2.CBO.on({
        
        load: function(combo) {
            
        }

})

is there away i can pass the load even from CBO to panel2 to then to panel1

Upvotes: -1

Views: 22

Answers (1)

Dinkheller
Dinkheller

Reputation: 5054

  1. Combobox does not come with load event. combobox.getStore() does. For the ease of this answer, I take it that you are firing the load event from the store to the combobox. If you dont, the simpliest way might be to use onStoreLoad ( store, records, success ) from combobox.

There are several ways of answering your question. 1, 2 and 3 are different approaches.

  1. correct writing
    xtype: 'component',
    items: [{
        xtype: 'component',
        items: [{
            xtype    : 'combobox',
            reference: 'my_cb',
            label    : 'myLabel',
            listeners: {
                load: function(cb) {
                    // do your stuff
                }
            }
        }]
    }]
  1. In Component
    initialize: function() {  //or initComponent classic
        const me    = this,
              cb    = me.lookup('my_cb'),
              altCb = me.down('combobox[label=myLabel]');

        cb.on({    
            load: function(combo) {
                // do your stuff
            }
        });

        // pass to component
        me.mon(cb, 'load', [fn], [scope], [options] );
    }
  1. Use ViewController
    // ParentView.js
    Ext.define('ParentView', {
        extend: 'Ext.Component',
        xtype: 'parent-view',

        controller: 'parent-view',

        items: [{
            xtype: 'component',
            items: [{
                xtype    : 'combobox',
                listeners: {
                    load: 'onCBLoad'
                }
            }]
        }]
    });

    // ParentViewController.js
    Ext.define('ParentViewController', {
        extend: 'Ext.app.ViewController',
        alias: 'controller.parent-view',

        onCBLoad: function(cb) {
            // do your stuff here
        }
    });

Cheers

Upvotes: 0

Related Questions