Question

I have a view (Panel) that is a card layout. I have a Store of, say, n items. I want to create a stack of n cards, each of which is backed by an item in the Store. How can I do this without manually adding n cards in a for loop, iterating through the items in the Store?

Answer 1

You need a separate list to contain all your cards, you CANNOT connect panel’s list of cards with a store (at least in current version of Sencha Touch).

You cannot avoid adding manually, but you can avoid for loops:

Ext.regModel('someModel', { 
    fields: [
        {name: 'title', type: 'string' },
        {name: 'info', type: 'string' }
    ]
});

var someStore = new Ext.data.Store({ 

    model: "someModel",
    listeners:{
        add:function(store, list, index){
            //here list is list of records you added
            var item = list[0];
            panelinstance.insert(index, {...whatever component...panel,list,carousal whatever});
        }
    } 
});

Careful about the caller: Add one item at a time to your store(this might sound ridiculous), but I think it is the only way to make your panel “CONNECT” to a store.