PDA

View Full Version : fire event after panel switch



rez
1 Dec 2010, 5:44 AM
I am having trouble getting my head around event firing after panels are switched,


if I use 'show : doStuff' the method runs, but the panel goes blank after switching
if I use 'render : doStuff' the method runs, panel is blank after switching if it uses a template, and

Uncaught TypeError: Cannot call method 'addCls' of undefined if using html

In both cases content loads properly when I initially load the app on the first panel, but disappears whens switching back and forth between panels.

How do I fire the event, and not end up with a blank panel?

In this case, doStuff is updating a template in the panel
ie.
--get json data --
panel1.update(data);

tomalex0
1 Dec 2010, 6:41 AM
could you try activate event of panel.

rez
1 Dec 2010, 2:38 PM
with activate the event is not fired at all :(

here is my code


var logThis2 = function() { console.log('x2'); };
var logThis3 = function() { console.log('x3'); };


var x2 = new Ext.Component({
title: 'Profile', // Name that appears on this tab
iconCls: 'user',
html: 'this is x2',
show: logThis2,
cls: 'nearby12', // The CSS class. Lets you style elements on the timeline.
scroll: 'vertical' // Make it vertically scrollable
});


var x3 = new Ext.Component({
title: 'Messages', // Name that appears on this tab
iconCls: 'bookmarks',
html: 'this is x3',
show: logThis3,
cls: 'nearby12', // The CSS class. Lets you style elements on the timeline.
scroll: 'vertical' // Make it vertically scrollable
});

var panel = new Ext.TabPanel({
fullscreen: true,
dockedItems: dockedItems,
tabBarDock: 'bottom',
pack: 'center',
cardAnimation: 'slide' ,
items: [nearbyUsers, favoriteUsers, x2, x3]
});


so I can switch between panels fine, but

show:

event fires, panels switch but are blank, for panels with templates images are downloaded but cannot see any content

render:

event fires, panels dont switch - Uncaught TypeError: Cannot call method 'addCls' of undefined

activate:

event does not fire, panels switch and have content


of course I want the best of both worlds- event firing and not ending up with a blank panel

tomalex0
1 Dec 2010, 8:04 PM
Could you provide some demo code

rez
1 Dec 2010, 9:03 PM
eventually I found a way to fire without blank content:


to the panels I added a listener instead of using activate directly:

listeners:{
activate:function() {
logThis2();
}
}

I am unsure if this is the recommended route when there are the listener shortcuts?

tomalex0
2 Dec 2010, 3:55 AM
Are you trying to update the panel body when Tabs are clicked?