PDA

View Full Version : List detail .seActiveItem undefined



mister_cairns
16 Jul 2011, 6:43 PM
Hi there,

Am putting together and app and attempting to get a list with a detail panel working. I have based it on the Sencha list video, but keep getting an error "TypeError: Result of expression 'abc.artistList.setActiveItem' [undefined] is not a function." when I try to click on an item and reveal the detail panel. The full code is below:


Ext.ns('abc', 'abc.panel', 'abc.store');

// Models _____________________________________________________________________
Ext.regModel('Artists', {
fields: ['firstName', 'lastName']
});


// Stores _____________________________________________________________________
abc.store.Artists = new Ext.data.Store({
model: 'Artists',
proxy: {
type: 'ajax',
url: 'http://localhost:8888/abc/stores/artists.json',
reader: {
type: 'json',
root: 'artists'
}
},
sorters: 'lastName',
getGroupString : function(record) {
return record.get('lastName')[0];
},
autoLoad: true
});

abc.artistDetail = new Ext.Panel({
id: 'detailpanel',
tpl: 'Hello, {firstName}!',
dockedItems: [
{
xtype: 'toolbar',
items: [{
text: 'back',
ui: 'back',
handler: function() {
abc.panel.Artists.setActiveItem('artistList', {type:'slide', direction:'right'});
}
}]
}
]
});

abc.artistList = new Ext.List({
title: 'Artists',
store: abc.store.Artists,
fullscreen: true,
id: 'artistList',
itemTpl: '<div class="contact">{firstName} {lastName}</div>',
grouped: true,
onItemDisclosure: function(record, btn, index) {
abc.artistDetail.update(record.data);
abc.panel.Artists.setActiveItem('detailpanel');
}
});

abc.panel.Artists = Ext.extend(Ext.Panel, {
id: 'artists',
title: 'Artists',
layout: 'card',
fullscreen: true,
cardSwitchAnimation: 'slide',
iconCls: 'artists',
items: [abc.artistList, abc.artistDetail],
});

abcPrimavera = new Ext.Application({
name: "abcApp",

onReady: function () {
var app = new Ext.TabPanel({
fullscreen: true,
animation: false,
tabBar: {
dock: 'bottom',
layout: {
pack: 'center'
}
},
items: [
new abc.panel.Artists()]
});
}
});


Any help would be brilliant.

Thanks

bharatn
17 Jul 2011, 7:46 PM
Call setActiveItem on the instance



onItemDisclosure: ...
...
Ext.getCmp('artists').setActiveItem('detailpanel');

mister_cairns
17 Jul 2011, 7:53 PM
Thanks so much! It works, but the back button is causing the same error - any idea how I can edit the handler function?

bharatn
17 Jul 2011, 7:58 PM
Call setActiveItem on instance.

Ext.getCmp('artists').setActiveItem('artistList', {type:'slide', direction:'right'});