CODEWITHSUNDEEP
extjsextjs4
Sashikant
Sashikant

Reputation: 97

Ext.getCmp is not working in ExtJS4

I am trying to create a component and access it inside controller. But while accessing the component by id, it is not returning the component. It always returns undefined. Please find below the code.

enter code here

//Component creation in view layer as below

Ext.define('MyApp.view.performance.grid.IFrameGridCmp', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.crMainPanel',
    id:'mainPanelId',
    layout: {
        align: 'stretch',
        type: 'vbox'
    },
    border:0,
    resizable: false,
    forceFit: true,
    autoWidth: true,
    initComponent: function() {
        Ext.apply(this, {
            items: [
                {
                    xtype:'panel',
                    flex:.02,
                    border:0
                },
                {
                    xtype:'crHeaderPanel',
                    flex:.05
                },
                {
                    xtype: 'crUpperPanel',
                    flex: 0.93
                },
                Ext.create('Ext.Component', {
                    autoEl: {
                        tag: 'iframe', 
                        cls: 'x-hidden', 
                        src: Ext.SSL_SECURE_URL
                    },
                    id:'FileDownloader',
                    height:0,
                    listeners: {
                        afterrender: function () {
                            this.getEl().on('load', function () {
                                console.log('loaded download frame');
                            });
                        }
                    },
                    load: function(config){
                        var e = this.getEl();
                        e.dom.src = config.url + (config.params ? '?' + Ext.urlEncode(config.params) : '');
                        e.dom.onload = function() {
                            Ext.getBody().unmask();
                            if(e.dom.contentDocument.body.childNodes[0].wholeText == '404') {
                                Ext.Msg.show({
                                    title: 'Attachment missing',
                                    msg: 'The document you are after can not be found on the server.',
                                    buttons: Ext.Msg.OK,
                                    icon: Ext.MessageBox.ERROR 
                                });
                            }
                        };
                    }
                })
            ]
        });
        this.callParent(arguments);
    }
});

========================================

    enter code here

//Accessing the controller as below in controller

views: ['performance.grid.IFrameGridCmp'],

//The below line gives error
var downloader = Ext.getCmp('FileDownloader');
            downloader.load({
                url: '/APXUI/data/json/xls?exportData='+Ext.JSON.encode(records)
            });

Upvotes: 0

Views: 4262

Answers (2)

Psycho
Psycho

Reputation: 335

In you controller use control for example to handle it: 

me.control({
    'crMainPanel #FileDownloader': {
         afterrender: me.addDownloader
    }
});

Don't use Ext.getCmp() it is really slow and you will have many issues with that. Don't use id - better use itemId. Why you need to call this from controller?

Upvotes: 0

sra
sra

Reputation: 23973

Well, the view is not created at the time you are calling Ext.getCmp()

Note that views: ['performance.grid.IFrameGridCmp'], is only a sort of binding that view to the controller, which means the controller will create a getter for you, nothing more. You still need to instantiate the view by calling .create(); or Ext.widget('crMainPanel')

Upvotes: 2

Related Questions