PDA

View Full Version : Can you dymanically edit the dockedItems?



rballman
1 Feb 2011, 3:29 PM
Hello,

I have a tabpanel with a dockedItems docked at the top. Initially it only has text in the dockedItems, but is there a way to dymanically edit the dockedItems? I would like to add a Back button to it and them remove it as well, later in the application.

Thanks.

AndreaCammarata
2 Feb 2011, 1:39 AM
Hi rballman.
yes you can dinamically add new dockedItems.
Take a look at this example



Ext.setup({
onReady: function() {

var btnToAdd = new Ext.Button({
text: 'Simple Button'
});

var pnlMain = new Ext.Panel({
fullscreen: true,
dockedItems: [{
xtype: 'toolbar',
title: 'Example',
itemId: 'mainToolbar',
items: [{
text: 'Add Button',
handler: function(){
var tb = pnlMain.getDockedComponent('mainToolbar');
tb.add(btnToAdd);
tb.doComponentLayout();
}
},{
xtype: 'spacer'
}]
}],
html: 'Simple Example'
});
}
});


After adding a new component, remember always to call "doComponentLayout" function.
Hope this helps.

rballman
2 Feb 2011, 11:09 AM
perfect, thanks!

in your example is there a way to remove the button as well?

AndreaCammarata
2 Feb 2011, 11:29 AM
To remove the button simple call


var tb = pnlMain.getDockedComponent('mainToolbar');
tb.remove(btnToAdd);
tb.doComponentLayout();


I suggest you to take a deep look into the API docs ;)
Hope this helps.

rballman
2 Feb 2011, 11:32 AM
yeah sorry. It wouldnt let me edit my post for some reason. anyhow I figured it out :)

I was able to delete the button but It wouldnt let me readd it. adding the following fixed it:


tb.doLayout();

lilford.immanuel
8 Apr 2011, 12:58 AM
Adding and removing works just right.. :)

When i try to add an removed item it does not show up.. :(

I tried setting autoDestroy to true and false with not effect../:)

What should I do??

heringsfilet
8 Apr 2011, 1:47 AM
I'm new to Sencha Touch and Javascript but maybe this is because the component has been destroyed and you probably need to reinstantiate it?