Databases
StackOverflow2013
Postsdbo
POSencha Touch: List detail .setActiveItem undefined
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POSencha Touch: List detail .setActiveItem undefined
    text
    copied!<p>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:</p> <pre><code>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: '&lt;div class="contact"&gt;{firstName} {lastName}&lt;/div&gt;', 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()] }); } }); </code></pre> <p>Any help would be brilliant.</p> <p>Thanks</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload