View Full Version : bringing a view to front

12 Jun 2012, 2:49 AM
Hey everybody

I created a container (I dont want to use a Window for css reasons)

now I want to bring it front but it says its undefined.....

this is the window:

Ext.define('MyApp.view.d_applying', { extend: 'Ext.container.Container',

height: 250,
id: 'd_applying',
width: 400,
layout: {
type: 'absolute'

initComponent: function() {
var me = this;

Ext.applyIf(me, {
items: [
xtype: 'image',
height: 201,
width: 201,
src: 'Htmls/images/casper.gif',
x: 100,
y: 50
xtype: 'label',
style: 'font-weight:bold;',
text: 'Applying Changes',
x: 150,
y: 30



this is how I was trying to "front" it


and I get :

"Cannot call method 'bringToFront' of undefined"

I also tried using the ZIndexManager...but despite being described as an Object in the API the debugger says it's function...so I invoked it..and then tried to see if it contained the container but it didn't....

any idea anyone?

Thanks :-)

12 Jun 2012, 2:52 AM
You must wait until the component is rendered.

12 Jun 2012, 3:06 AM
But how do I know if it's rendered yet?

12 Jun 2012, 3:19 AM
var window = Ext.create('MyApp.view.d_applying');
window.on('rendered', function () { window.toFront(); });

Something like this

12 Jun 2012, 6:37 AM
tried it..but I still get the same error

12 Jun 2012, 6:53 AM
But I still don't see the container infront of everything else... :-(

12 Jun 2012, 7:23 AM
Make sure the container is a floating component
Or see the zindex manager

14 Jun 2012, 12:31 AM
However I don't see it...I dont get any errors though when calling

var ApplyingScreen = GUI.create('MyApp.view.d_applying');
ApplyingScreen.on('rendered', function () { ApplyingScreen.toFront(); });

14 Jun 2012, 6:21 AM
So I think your component is never rendered.

Use the renderTo config to render it where you want.