Dynamic tab generation

[macdoug1]

I'm having trouble getting something similar to the example working to do the tab generation. Anyway here is my situation: I have a menu that I have an image and a text link that need to be clickable and from this generate a new tab with contents. I've looked at the example on the examples page with the button that generates a closable tab which is what I want but unfortunately I can't seem to get this to work since I am new to the MVC pattern I can't seem to get a my hands on the tab panel that is in the app.js file. Can anyone help?



launch: function() { var vp = Ext.create('Ext.container.Viewport', {
layout:'fit',

items:[{
xtype:'tabpanel',
activeTab:0,
items:[{
title:'Customer Portal',
layout:'fit',
items:[{
xtype:'tabpanel',
activeTab: 0,
id:'tabs',
items:[{
title:'Create a Ticket',
id:'ct',
layout: {
type: 'vbox',
align: 'center'
},
items:[{
/*loader: {
url:'',
autoLoad:true,
renderer: 'html',
text: "Loading...",
timeout: 60
}*/

}]

},{
title:'Ticket Status',
html:'Coming soon!'
/*loader: {
url:'',
autoLoad:true,
renderer: 'html',
text: "Loading...",
timeout: 60
}*/
},{
title:'Mission Control',
xtype:'missionmenu'




items:[{
xtype:'panel',
header:false,

width:'25%',
items:[{
xtype:'imagecomponent',
autoEl:{
tag:'img',
src:'./images/terminal_logo.jpg',
height:118
},
listeners:{
render: function(c){
c.getEl().on('click', function(e) {
addTab(true);
},c);
}
}
//html:'<img src="./images/terminal_logo.jpg" height="118"</a>',
/*handler: function () {
addTab(true);
},*/
//action:'addTab'
},{
html:'<a href="" ><img src="./images/_logo.jpg" height="118"</a>'
}]

I placed the code for the addTab(true) function outside the second items define but then I think I lose scope here and I can't seem to get my hands on anything. Anyway I was trying to put the function in the controller but I can't seem to get it to work. Does anyone have any suggestions?

[James Goddard]

try:

Ext.getCmp ('tabs').addTab (...

[macdoug1]

I had to move the method into the same class and just use the Ext.getCmp('tabs') to return the component. This allowed me to then just add the tab to the function. Thanks for the suggestion it helped see the issue.