Uncaught Error: [ERROR][Ext.Container#onFirstItemAdd]

[parky128]

I was just debugging my application and realised I had sencha-touch-all and not the sencha-touch-all-debug file included.

After I swapped files over and ran my application again, an error was raised that I have not seen before:

Uncaught Error: [ERROR][Ext.Container#onFirstItemAdd] Adding a card to a tab container without specifying any tab configuration

Switching back to the non debug file doesnt give this error and my application displays fine.

I only have a couple of TabPanel views defined like so:


Ext.define('PinpointersTouch.view.MainView', {
extend: 'Ext.TabPanel',
xtype: 'mainview',
requires: [
'PinpointersTouch.view.UnitList',
'PinpointersTouch.view.GMapContainer',
'PinpointersTouch.view.PreferencesView',
'PinpointersTouch.view.History'
],
config: {
fullscreen: true,
tabBar : {
docked : 'bottom',
layout : {
pack : 'center'
}
},
items: [
{
xtype: 'unitslist',
title: 'Locations',
iconCls: 'locate',
iconMask: true


},{
xtype: 'historyview',
title: 'History',
iconCls: 'time',
iconMask: true



},{
xtype: 'gmapcontainer',
title: 'Map',
iconCls: 'maps',
iconMask: true



},{
xtype: 'toolbar',
docked: 'top',
ui: 'light',
itemId: 'topToolbarMain',
defaults: {
iconMask: true
},
items: [
{ xtype: 'spacer' },
{ iconCls: 'refresh', itemId: 'btnRefresh' },
{ iconCls: 'user', itemId: 'btnUserLogout' },
{ iconCls: 'settings', itemId: 'btnUserPrefs' }
]
}
]
}
});


And...


Ext.define('PinpointersTouch.view.History', {
extend: 'Ext.TabPanel',
xtype: 'historyview',
requires: [

'PinpointersTouch.view.JourneySummaryView',
'PinpointersTouch.view.JourneyDetailView'
],
config: {
fullscreen: true,
tabBar : {
hidden: true
},
items: [{
xtype: 'journeysummaryview'

},{
xtype: 'journeydetailview'
}],


}


});


What could be the problem here?
Thanks

[mitchellsimoens]

I see two things... you have two items that have fullscreen set to true but one is a child of another. Second, I would extend from Ext.tab.Panel instead of Ext.TabPanel... it shouldn't create an error just would use the primary class name.

[parky128]

I followed your suggestion but I still got the same error, I got around this by specifying title configs on the child panels of my History Tab Panel view:


Ext.define('PinpointersTouch.view.History', {
extend: 'Ext.tab.Panel',
xtype: 'historyview',
requires: [

'PinpointersTouch.view.JourneySummaryView',
'PinpointersTouch.view.JourneyDetailView'
],
config: {
//fullscreen: true,
tabBar : {
hidden: true
},
items: [{
xtype: 'journeysummaryview',
title: 'a'

},{
xtype: 'journeydetailview',
title: 'b'
}],


}


});


I am hiding the tab bar as this is a nested Tab Panel and I am switching between these two tabs in a different manner.

[Jayson Monterroso]

Any update with this issue I'm having the same issue, :(
:((

[ssyntel]

You may be forgetting to set title property of any items that are added to TabPanel.

[jatinderbimra]

I also facing same error message after adding title in the code below it worked for me...as said above...
Thanks.


Ext.define('GS.view.Forms', {
extend: 'Ext.tab.Panel',
xtype: 'forms',


requires: [
'Ext.form.Panel',
'Ext.form.FieldSet',
'Ext.field.Number',
'Ext.field.Spinner',
'Ext.field.Password',
'Ext.field.Email',
'Ext.field.Url',
'Ext.field.DatePicker',
'Ext.field.Select',
'Ext.field.Hidden',
'Ext.field.Radio',
'Ext.field.Slider',
'Ext.field.Toggle',
'Ext.field.Search'
],


config: {
activeItem: 0,
title: 'Forms Example',
iconCls: 'star',
...
...