How to pass a variable from a list to a new view in Sencha Touch 2

Question

I try for 2 days to make a link between a list and a new view in Sencha 2.

I have my list inside a card layout :

Ext.define("BNC.view.Categorii", {
    extend: 'Ext.Panel',

    config: {
        layout: 'card',
        styleHtmlContent: true,
        scrollable: false,
        items: [{
            xtype: 'list',
            itemTpl: '<div class="itemCategorii" id="{id}"><div style="float:left;">{nume}</div><div style="float:right;">{id}</div></div>',
            listeners: {
                select: function(view, record) {
                    console.log(record.raw.id);
                    Ext.Viewport.setActiveItem(showDetails);
                    // How can I pass record.raw.id or record.raw.nume to showDetails view ?
                }
            },
            store: 'categoriiDB'

        }]
    }
});

My showDetails is:

var showDetails = Ext.create('BNC.view.Detalis');

My Details view is:

Ext.define("BNC.view.Bancuri", {
    extend: 'Ext.Panel',
    config: {
        layout: 'card',
        styleHtmlContent: true,
        scrollable: false,
        items: [{
            docked: 'top',
            xtype: 'toolbar',
            title: '**Here I need the var sended by list select**'
        }]
    }
});

I need to pass id from list item to the next view created by

Ext.Viewport.setActiveItem(showDetails);

and print the id in the title of my toolbar?

I`m very new in Sencha Touch and this problem is making me to give up :(

Answer 1

I recomend you tu use the http://docs.sencha.com/touch/2-0/#!/video/list example. Is very usefull and you hace an example to pass variable between the list and the detail view. Function in controler like shoDetail(), etc...