setActiveItem() passing data sencha touch

Question

I would like to send data with setActiveItem() when doing view change from this store:

Ext.define('SkSe.store.Places',{
    extend:'Ext.data.Store',
    config:{
        autoDestroy: true,

        model:'SkSe.model.Places',

        //hardcoded data

        data: [
            {
                name: 'Caffe Bar XS', //naziv objekta
                icon: 'Icon.png', //tu bi trebala ići ikona kategorije kojoj pripada
                stamps: 'stamps1' //broj "stampova" koje je korisnik prikupio
            },
            {
                name: 'Caffe Bar Mali medo',
                icon: 'Icon.png',
                stamps: 'stamps2'
            },
            {
                name: 'Caffe Bar VIP',
                icon: 'Icon.png',
                stamps: 'stamps3'
            }
        ]

        //dynamic data (Matija)
        //remember to change the icon path in "Akcije.js -> itemTpl"

        /*proxy:{
            type:'ajax',
            url:'https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=500&types=food&name=harbour&sensor=false&key=AIzaSyCFWZSKDslql5GZR0OJlVcgoQJP1UKgZ5U',
            reader:{
                type:'json',
                //name of array where the results are stored
                rootProperty:'results'
            }
        }*/
    }
});

This is my my details controller that should get data from places store:

Ext.define('SkSe.controller.Details', {
    extend: 'Ext.app.Controller',

    config: {

        refs: {
            placesContainer:'placesContainer',
            Details: 'details'
        },
        control: {
            //get me the list inside the places which is inside placesContainer
            'placesContainer places list':{
                itemsingletap:'onItemTap'
                //itemtap:'onItemTap'
            }

        }
    },

    onItemTap:function(list,index,target,record){

           console.log('omg');


        var addcontact= Ext.create('SkSe.view.Details',
            {
                xtype:'details',
                title:record.data.name,
                data:record.data
            });



        var panelsArray = Ext.ComponentQuery.query('details');
        console.log(panelsArray);
        Ext.Viewport.add(addcontact);
        addcontact.update(record.data.name);
        Ext.Viewport.setActiveItem(addcontact);
        console.log(record.data.name);
    }

});

I would like to send name record from the places.js model above. I heard that you can't pass data with setActiveItem but should create a function that updates view(No I can't use pop and push here).

I'm not very familiar with sencha touch syntax and I'm not sure what functions to use to do that, clearly update function is not that.

bwags bwags · Accepted Answer · 2013-07-01T15:03:27

I switched up your logic slightly but have provided a working example of what I think you are trying to do.

SenchaFiddle is a little different from what I get running on my machine but you should be able to get the idea.

The initial list loaded gets the data from your store, and on itemtap will push a new view onto the viewport.

You will need to add a navigation button to get back to the list from view.View as well as a better layout for the details. I would suggest nested containers or panels with custom styles to get the details just right. Alternatively you can just drop a full html snippet in there with all the data laid out like you want.

Would be happy to help more.

Fiddle: http://www.senchafiddle.com/#XQNA8

setActiveItem() passing data sencha touch

1 Answers