PDA

View Full Version : Noob: problems changing card - this.items.items[0] problem



bastard
2 Sep 2011, 1:24 PM
I'm am trying to get MVC to work in my first application and am trying to change cards based button clicked in toolbar. I'm getting a runtime error when I click the Button1 or Button2: "TypeError: Cannot read property 'items' of undefined"


View the code with better syntax highlighting: http://bastard.comli.com/question.html




MyApp.views.HomeScreenPanel = Ext.extend(Ext.Panel, {
layout : 'card',
cardSwitchAnimation: 'slide',
initComponent : function() {
this.dockedItems = this.buildDockedItems();
this.items = this.buildItemList();
MyApp.views.HomeScreenPanel.superclass.initComponent.call(this);
},
buildItemList : function(){
return [
new Ext.Panel({html:"hello"}),
new Ext.Panel({html:"world"}),
];
},
buildDockedItems : function(){
return [
this.buildTopDockToolbar(),
this.buildBottomDockToolbar(),
];
},
buildTopDockToolbar : function(){
return {
xtype : 'toolbar',
dock : 'top',
title : 'My first MVC app',
};
},
buildBottomDockToolbar : function(){
return this.NavigationToolbar();
},
NavigationToolbar : function(){
return{
xtype : 'toolbar',
dock : 'bottom',
defaults : {
handler : this.NavigationToolbarHandler,
controller: 'NavigationBarController'
},
items : [
{
text : 'hello',
action: 'hello'
},
{
text : 'world',
action : 'world'
}]
};
},
NavigationToolbarHandler : function(btn) {


var exerciseListPanel = this.items.items[0], // CODE ERRORS HERE!
workoutListPanel = this.items.items[1];

Ext.dispatch({
controller : btn.controller,
action : btn.action,
views : {
exerciseListPanel: exerciseListPanel,
workoutListPanel: workoutListPanel,
}
})
},
});


Ext.reg('HomeScreenPanel',MyApp.views.HomeScreenPanel);





Ext.regController('NavigationBarController', {
world : function(dataObj) {
Ext.Msg.alert(
'world!',
'world button pressed from toolbar',
Ext.emptyFn
);
MyApp.views.HomeScreenPanel.setActiveItem(dataObj.views.worldPanel); // CORRECT SYNTAX????



},
hello : function(dataObj) {
Ext.Msg.alert(
'hello',
'hello button pressed',
Ext.emptyFn
);
MyApp.views.HomeScreenPanel.setActiveItem(dataObj.views.helloPanel); // CORRECT SYNTAX?????


}
});

mitchellsimoens
3 Sep 2011, 6:13 AM
You can wrap your code on these forums with the BBCode CODE tag. You can highlight your code and click the number ('#') button in the toolbar or type [ CODE ] (without the spaces).

You setActiveItem call is valid, you can pass a number, id, or the instance you want to be active. Are those actual instances?

bastard
3 Sep 2011, 8:16 AM
But I'm getting an error on this line :
var exerciseListPanel = this.items.items[0], // CODE ERRORS HERE!

The error is:
TypeError: Cannot read property 'items' of undefined

No matter what I try to get a pointer to the items does not work :-?

Here is the code with better syntax highlighting
http://bastard.comli.com/question.html

mitchellsimoens
5 Sep 2011, 7:19 AM
I wouldn't manually go into the items array like that.

Step through your problem.. is "this" correctly scoped to the HomeScreenPanel. Does this.items.getCount() return zero or more?

bastard
5 Sep 2011, 9:45 AM
I tried your suggestion to see if this.items.getCount() returns anything but instead I get:
TypeError: Cannot call method 'getCount' of undefined

I'm not sure what you mean by: is "this" correctly scoped to the HomeScreenPanel

How would I scope 'this' to HomeScreenPanel? :-?

bastard
5 Sep 2011, 1:54 PM
Ahh... I got what you mean. I added a scope:this statement and it seemed to have solved the problem. :)

Thanks!