Question

I have a small example Sencha Touch 2 app at http://www.senchafiddle.com/#FWMDh. It populates a DataView from a store and each of the models renders some text in the view. Lovely. What I would actually like to do is have the DataView work, not from the store, but from one of the models ‘letters’ property – that is, an array. So that the DataView will end up displaying a list of letters from just one of the words.

Any ideas on how to accomplish this? Ta.

Answer 1

DataView needs to have a Store, so there is no other way but to convert that data in your Model into something a Store can read (an Array of Objects) and then bind that store to the DataView.

Something like this:

var letters = record.get('letters'), // get the letters array from the model
    lettersData = [], // we are going to create a new array of objects
    ln = letters.length,
    store, i;

for (i = 0; i < ln; i++) {
    // push each of the letters into the lettersData array, but as objects
    lettersData.push({
        letter: letters[i]
    });
}

store = Ext.create('Ext.data.Store', {
    fields: ['letter'], // set the only field as a letter. This will automatically create a model for this store
    data: lettersData // set the store data as the lettersData array
});