View Full Version : CityBars video tutorial - itemtap function error?

26 Mar 2012, 10:21 PM
Quick question: Has anyone tested Phil Strong's CityBars project lately to see if it works? My particular issue is related to Phil's first look video tutorial on Sencha Designer 2 at:


I've been working on my app following the CityBars tutorial using Sencha Designer 2 closely, and I had my particular solution working fine. After a few weeks of inactivity, I re-opened up my project and Sencha updated a few things, and after a quick test, I noticed one aspect of my app failed to work.

The issue, as far as I can tell is related to this particular part of Phil's code (which I similarly used in my app). The itemtap function:

var me = this;

if (record) {

if (!me.details) {
me.details = Ext.create('CityBars.view.DetailPanel', {
title: 'Details'

// set the map
var map = me.details.child('#detailMap');
zoom: 17
latitude: record.get('latitude'),
longitude: record.get('longitude')

// set the info
var info = me.details.child('#contact').child('#info');


If I click on an item in the listing, I get the relevant bar's details - it works fine the first time. If I then go back and click on another item in the list, nothing happens. The error I get in the console log from Chrome when I click is:

Uncaught TypeError: Cannot call method 'child' of null

The error points to this specific point in the code:


It seems to be unable to add the new data there because the parent doesn't exist. I did some console.log tests and saw that for some odd reason info variable is empty when trying to set it ( var info = me.details.child('#contact').child('#info'); )

Anyway, can someone simply test the CityBars project to see if it works or do they hit the same error when clicking on the list twice or more times. Thanks.

On an additional note, if I comment out the "if (!me.details)" conditional in the itemtap function so it goes ahead and creates CityBars.view.DetailPanel no matter what, then it works.

27 Mar 2012, 7:05 AM
Yes the framework changed and so must the code! Caching of the detail card is no longer the way to go.

see: https://github.com/philstrong/citybars/blob/master/app/controller/Business.js
for how I'm doing it now

27 Mar 2012, 11:01 AM
Yes the framework changed and so must the code! Caching of the detail card is no longer the way to go.

Hi, may I ask why its not the way to go?
I guess that we talk about:

if (!me.details) { me.details = Ext.create('CityBars.view.DetailPanel', {
title: 'Details'

I use it myself on some Navigation Views (where destroy:false) I thought it was faster/better to reuse the view instead of creating a new one every time?