PDA

View Full Version : how to add dynamic tabs



pra123@
22 May 2013, 7:38 AM
Hi all,
I have tab panel with one tab. first tab contains 2 text field and 1 combobox.
Here i have a toolbar with one button call "Add tab". when i will click on this i want to add one tab.
i am doing like this



var tabs = win.down('tabpanel');
var count = tabs.items.getCount();
var tab = tabs.add(Ext.widget('panel', {
itemid: 'tpnPS'+ count,
title: 'New Tab ' + count,
html: 'Html ' + count
}));tabs.setActiveTab(tab);



But here newly created tab panel is empty. i want to add same no of controls what i have in firest tabls (2 text field and 1 combobox). (as in snapshot)
How i will copy those controls to second tab.

Can someone please help, how i will do this?

slemmon
24 May 2013, 8:52 AM
You can define a form component first and then create an instance of it as a tab with your Add Tab button.



Ext.define('MyApp.view.MyCustomForm', {
extend: 'Ext.form.Panel',
alias: 'widget.mycustomform',

items: [{
// ... your fields for the form
}]
});


Then you can add a mycustomform widget to your tabpanel and it will include the fields set in the MyCustomForm class definition.


tabpanel.add({
xtype: 'mycustomform'
});