Pushing a new view after an item was tapped in Sencha Touch 2

Question

I have a simple list populated from json. When tapping one of the items i want a new view to appear. The List is inside an Ext.navigation.View.

My controller

Ext.define('Trainz.controller.StationListController', {
extend: 'Ext.app.Controller',

config: {
    models: [
        'Station'
    ],
    stores: [
        'Stations'
    ],
    views: [
        'Main'
    ],

    control: {
        "list": {
            itemtap: 'onListItemTap'
        }
    }
},

onListItemTap: function(dataview, index, target, record, e, eOpts) {
    console.log(record);
}

});

And here is the (now empty) view i want to push

Ext.define('Trainz.view.StationDetailView', {
extend: 'Ext.Panel',

config: {
}

});

Guessing i have to put something in the onListItemTap function but for the life of me I cant figure out what. Tried over four different code snippets from Google and just got errors back. Whats the proper way?

I'm using Sencha Architect if that makes any difference.

Here is the complete initial view for reference:

Ext.define('Trainz.view.Main', {
extend: 'Ext.tab.Panel',

config: {
    tabBar: {
        docked: 'bottom'
    },
    items: [
        {
            xtype: 'navigationview',
            title: 'Stations',
            iconCls: 'maps',
            items: [
                {
                    xtype: 'list',
                    title: 'Stations',
                    itemTpl: [
                        '<div>{Namn}</div><div style="float:right; margin-right: 1.5em;"></div>'
                    ],
                    store: 'Stations',
                    grouped: true,
                    indexBar: true
                }
            ]
        }
    ]
}

});

Answer 1

You need need to retrieve your navigationview and then do

navigationView.push(yourNewView); 

or

dataview.up('navigationview').push(yourNewView)

http://docs.sencha.com/touch/2.2.0/#!/api/Ext.navigation.View-method-push

Hope this helps