PDA

View Full Version : Problem with tabbar



vipezz
23 Mar 2011, 11:32 AM
Hello everyone,

First of all, nice framework, very powerfull. I have a few problems thou, i hope you guys can help me out.

I started a project wich has a loginpanel, after i logged in i set up a tabpanel and thats where the problem is. This is what i hae so far:

In my loginpanel i call my tabpanel. My tabpanel looks like this:

test.views.HomePanel = Ext.extend(Ext.Panel,{
fullscreen: true,
cardSwitchAnimation: 'cube',
items: [
new test.views.FirstPanel()
new test.views.SecondPanel()
new test.views.ThirdPanel()
]
});

Ext.reg('test-homepanel', test.views.HomePanel);

This is where the problem is. The error is: Uncaught TypeError: undefined is not a function
In general it says that my FirstPanel is undefined. The contents of my FirstPanel are:


test.views.FirstPanel = Ext.extend(Ext.Panel,{
layout: {
type: 'vbox',
pack: 'center'
},
items: [
{xtype: 'panel', html: 'Panel 1'},
{xtype: 'panel', html: 'Panel 2'},
});

Ext.reg('test-FirstPanel',test.views.FirstPanel);

When i attach my FirstPanel directly to my LoginPanel i have no errors and the page loads nicely. Anyone who knows where my problem might be?

d5chris
23 Mar 2011, 3:31 PM
Try this:


test.views.HomePanel = Ext.extend(Ext.Panel,{
fullscreen: true,
cardSwitchAnimation: 'cube',
items: [
{xtype: 'test-FirstPanel'},
{xtype: 'test-SecondPanel'},
{xtype: 'test-ThirdPanel'}
]
});

Let me know if it works.

vipezz
24 Mar 2011, 9:39 AM
Yes this worked nicely, tyvm

d5chris
24 Mar 2011, 1:26 PM
Ok great, and now for the explanation of *why* it worked:

When you had your code like this: "test.views.HomePanel = Ext.extend(Ext.Panel,{...", what it is doing is declaring a class, which is like a blueprint for a panel.

When, inside that class declaration, you had "items: [new test.views.FirstPanel()...", that is actually declaring an instance. The problem is that you can't have instances inside a class definition.

Hope that makes sense