Tabpanel Items automatically add a header to its dockedItems

[sophicworks]

Hi, I'am new to EXTJS and I'am trying to find a way how to make my Tabpanel items not to create the header
automatically

37624

the header was added to the dockedItems, and yes I don't want may tab to create that header since it's redundant for me to display the name of the tab



function tabCreationManager(girdToCreate,data){

workspaceTabPanel = Ext.getCmp('workspaceTabpanel');
//SelectedTab if not found is undefined and consider as false
var SelectedTab = workspaceTabPanel.getChildByElement('Tab_'+data.id);

//Select the tab if it exist else create the tab and its contents
if(SelectedTab)
{
workspaceTabPanel.setActiveTab(SelectedTab);
}
else
{
windowArray = new Array();
GridList = Ext.widget(girdToCreate); //creates a gridpanel


var newTab = Ext.create('PA.view.TabItem',{
title: data.name+' Tab',
windowOpen: windowArray, //custom config
id:'Tab_'+data.id,
items: [GridList]});

var addedTab = workspaceTabPanel.add(newTab);

workspaceTabPanel.setActiveTab(addedTab);
if(workspaceTabPanel.hidden)
{
workspaceTabPanel.show();
}
}
}


Here is the PA.view.TabItem code



Ext.define('PA.view.TabItem', {
extend: 'Ext.panel.Panel',
alias : 'widget.tabitem',

closable: true,
layout: 'fit',
header: false,


listeners: {
beforeclose: function(component,a){
if(component.windowOpen.length){
Ext.Msg.alert('Error Code: 0042',component.title.toUpperCase() +' is still busy at the moment, to
close this tab please make '+ 'sure to close all the existing processes inside
+'component.title.toUpperCase() +'. Thank you!');
return false;
}
}
}
});



I already set the header to false but the panel header is still showing..
I hope you can help me find a way to fix this or at least remove the header, Thanks in Advance

[scottmartin]

Where is your code that is adding the header as shown:

From the API:


var tabs = Ext.create('Ext.tab.Panel', {
items: [
{
title: 'Tab 1',
html : 'A simple tab'
}
],
renderTo : Ext.getBody()
});

Ext.create('Ext.button.Button', {
text : 'New tab',
scope : this,
handler : function() {
var tab = tabs.add({
title: 'Tab ' + (tabs.items.length + 1),
html : 'Another one'
});

tabs.setActiveTab(tab);
},
renderTo : Ext.getBody()
});​


Scott.

[sophicworks]

thanks for the reply scott!

I realized that the cause of my problem was the panel header is also created when trying to add Ext.panel.Panel inside the the tab.

Sorry for giving incomplete information I was about to edit my post, here is the details of my code



function tabCreationManager(girdToCreate,data){

workspaceTabPanel = Ext.getCmp('workspaceTabpanel');
//SelectedTab if not found is undefined and consider as false
var SelectedTab = workspaceTabPanel.getChildByElement('Tab_'+data.id);

//Select the tab if it exist else create the tab and its contents
if(SelectedTab)
{
workspaceTabPanel.setActiveTab(SelectedTab);
}
else
{
windowArray = new Array();
GridList = Ext.widget(girdToCreate); //creates a gridpanel


var newTab = Ext.create('PA.view.TabItem',{
title: data.name+' Tab',
windowOpen: windowArray, //custom config
id:'Tab_'+data.id,
items: [GridList]});

var addedTab = workspaceTabPanel.add(newTab);

workspaceTabPanel.setActiveTab(addedTab);
if(workspaceTabPanel.hidden)
{
workspaceTabPanel.show();
}
}
}


Here is the PA.view.TabItem code



Ext.define('PA.view.TabItem', {
extend: 'Ext.panel.Panel',
alias : 'widget.tabitem',

closable: true,
layout: 'fit',
header: false,


listeners: {
beforeclose: function(component,a){
if(component.windowOpen.length){
Ext.Msg.alert('Error Code: 0042',component.title.toUpperCase() +' is still busy at the moment, to
close this tab please make '+ 'sure to close all the existing processes inside
+'component.title.toUpperCase() +'. Thank you!');
return false;
}
}
}
});




I already set the header to false but the panel header is still showing..

[sophicworks]

OK! I fix my problem, I change what my PA.view.TabItem extends which is from Ext.panel.Panel to Ext.container.Container.



Ext.define('PA.view.TabItem', {
extend: 'Ext.container.Container', // from Ext.panel.Panel
alias : 'widget.tabitem',

closable: true,
layout: 'fit',
header: false,


listeners: {
beforeclose: function(component,a){
if(component.windowOpen.length){
Ext.Msg.alert('Error Code: 0042',component.title.toUpperCase() +' is still busy at the moment, to'
+close this tab please make sure to close all the existing processes inside '+
component.title.toUpperCase() +'. Thank you!');
return false
}
}
}
});




Thanks for the reply and concern scott. I appreciate what you did :D