PDA

View Full Version : TabPanel add problem



fourfingerwu
5 Nov 2010, 1:51 PM
hi there

I have been trying unsuccessfully for about 4 hours to add a new item to a TabPanel. I have searched and search for an answer but I must be doing something wrong.

I have a form with a button when the button is click I would like to add a carousel to the TabPanel.

I have read the you use the
“add( ...Object/Array component ) : Ext.Component/Array”
then call the
“doLayout() : Ext.Container”

i am using the Ext.getCmp as the var carousel1 and panel don’t seem to be in same scope as the form button.

the alerts fire so I am assuming the I have collected the Cmps but nothing seems to happen. I must be doing something wrong but I'm not sure where.


var carousel1 = new Ext.Carousel({
id:'carousel1',
title: 'carousel1',
defaults: {
cls: 'card'
},
items: [latest_posts,my_posts]
});

var panel = new Ext.TabPanel({
id:'panel',
fullscreen: true,
cardSwitchAnimation: 'slide',
items: [settingsForm]
});

/*form button code*/

handler: function() {

var tp = Ext.getCmp('panel');
var ca = Ext.getCmp('carousel1');

if(tp)
{
alert(‘panel found’);
}

if(ca)
{
alert(‘carousel1 found’);
}

tp.add(ca);
tp.doLayout();
}


any help with this would be great

thanks again

Mac

Steffen Hiller
5 Nov 2010, 7:28 PM
Instead of "add" use "setActiveItem".

fourfingerwu
6 Nov 2010, 12:43 AM
Hi Steffen

I have tried the setActiveItem, the problem is that the carousel has not been added to the tab panel items array.
the idea is that when the user logs into the system new cards are added to the tab panel items array.

thanks for your help

Mac

Animal
6 Nov 2010, 1:04 AM
First add the new Component.

Then.

Use tp.doComponentLayout to make the TabPanel update its tab bar.

If you want to actually activate the new item, use tp.setActiveItem to tell the TabPanel to activate the new item.

fourfingerwu
6 Nov 2010, 1:43 AM
Hi Animal

got a feeling I am going to owe you a couple of beers
I have tried the following



tp.add(ca);
tp.doComponentLayout();


when the button is pressed it browser seem to hang for a second. I think that is the point where the tabpanels layout is being recalculated. but the Carousel doesn't appear in the tabpanel.

am I going about this is the correct way would it be better to add all the component at the start and hide/show the ones need??

thanks again

Mac

Steffen Hiller
6 Nov 2010, 4:05 AM
I don't see why setActiveItem isn't working for you. If the card you pass to setActiveItem doesn't exist, setActiveItem adds it automatically for you.
This must be something Carousel related then, since setActiveItem works fine for me.

Animal
6 Nov 2010, 6:07 AM
Hi Animal

got a feeling I am going to owe you a couple of beers
I have tried the following



tp.add(ca);
tp.doComponentLayout();


when the button is pressed it browser seem to hang for a second. I think that is the point where the tabpanels layout is being recalculated. but the Carousel doesn't appear in the tabpanel.

am I going about this is the correct way would it be better to add all the component at the start and hide/show the ones need??

thanks again

Mac

You will need to call setActiveItem to show the newly added Component. Adding it just adds it.