Question

Can somebody say me why the “getEl()” method doesn’t work at my code?

NotificationContainer:

Ext.define('common.NotificationContainer', {
    extend: 'Ext.container.Container',
    alias: 'widget.NotificationContainer',
    border: true,
    layout: {
        type:'fit'
    },
    style: {
        zIndex: '999999'
    },
    defaultType: 'container',
    items: [{
        cls: 'notification-box',
        border: true,
        width: 500,
        items:[{
            html: ''
        },{
            layout: {
                type: 'vbox',
                align: 'center'
            },
            items: [{
                xtype: 'button',
                text: 'OK',
                minWidth: 75,
                margin: '10 0 0 0',
                handler: function() {
                    this.up().up().up().getEl().slideOut('t', { duration: 1000 });
                }
            }]
        }]
    }]
});

Function:

var con_notification = Ext.create('common.NotificationContainer');
var con_notification_box = con_notification.child();

con_notification_box.addCls(cls);
if (server_response == undefined) {
    con_notification_box.items.items[0].update('<p><span class="custom-msg">' + custom_msg + '</span></p>');
} else {
    con_notification_box.items.items[0].update('<p><span class="custom-msg"> ' + custom_msg + '</span><br /><br /><span class="server-response">Server Response:</span>' + server_response + '</p>')
}

con_notification.add(con_notification_box);
con_notification.getEl().slideIn('t', {
    easing: 'easeOut',
    duration: 1000
});

Thank you very much for your support!

Kind regards, shub

Answer 1

It’s quite hard to inpect errors from a little code like this but there’s a fact that, getEl() only returns a valid element when your component is rendered.

Hope it helps.