PDA

View Full Version : User control panel



warriorofdreams
28 Nov 2007, 2:19 AM
Already figured it out, topic can be closed!









I'm making a user control panel so I started with creating a window shown in the following demo:

http://extjs.com/deploy/dev/examples/window/layout.html

Now I want to add in the navigation a link that can create a new tab, something like this:

http://extjs.com/deploy/dev/examples/tabs/tabs-adv.html

But than integrated in the window, also I don't want to use a link. Can someone help me?

Thanks in advance,

Warriorofdreams




Current code:

Ext.onReady(function(){


var button = Ext.get('show-btn');

button.on('click', function(){

// tabs for the center
var tabs = new Ext.TabPanel({
region: 'center',
margins:'3 3 3 0',
activeTab: 0,
defaults:{autoScroll:true},

items:[{
title: 'Introduction',
html: '<p>This is the user control panel</p>'
},{
title: 'Closable Tab',
html: '<p>This is the user control panel</p>',
closable:true
}]
});

// Panel for the west
var nav = new Ext.Panel({
title: 'Menu',
region: 'west',
split: true,
width: 200,
collapsible: true,
margins:'3 0 3 3',
cmargins:'3 3 3 3',
html: 'Menu link 1<div id="tab" onClick="addTab()">Klick</div>'
});

var win = new Ext.Window({
title: 'User Control Panel',
closable:true,
width:600,
height:350,
//border:false,
plain:true,
layout: 'border',

items: [nav, tabs]
});

win.show(this);
});

function addTab(){
tabs.add({
title: 'New Tab ',
iconCls: 'tabs',
html: 'Tab Body <br/><br/>',
closable:true
}).show();
}

});

warriorofdreams
28 Nov 2007, 8:02 AM
Can nobody help me?