Question

I have the following data:

var data = [
    {
        id: 1,
        name: 'Ed Spencer',
        phoneNumber: '555 1234',
        children: [{
          id: 11,
          name: 'Baz'
        }]
    },
    {
        id: 2,
        name: 'Abe Elias',
        phoneNumber: '666 1234',
        children: [{
          id: 21,
          name: 'Foo'
        },{
          id: 21,
          name: 'Bar'
        }]
    }
];

Is there a way to load it into some models and a store, like this?

Ext.define('Child', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id',    type: 'int'},
        {name: 'user_id',    type: 'int'},
        {name: 'name',  type: 'string'}
    ],

    belongsTo: 'User'
});

Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id',    type: 'int'},
        {name: 'name',  type: 'string'},
        {name: 'phone', type: 'string', mapping: 'phoneNumber'}
    ],

    hasMany: {model: 'Child', name: 'children'}
});

var store = Ext.create('Ext.data.Store', {
    autoLoad: true,
    model: 'User',
    data : data
});

I have only found one way to do this so far, by looping over the store:

store.each(function(r){
  r.childrens().loadData(r.data.children);
});

But this doesn’t seem great.

I only want to load the data once. I don’t really want to specify the foreign key in each child, as my data is already structured.

Has anyone done something similar? Is there a better way to approach this?

Answer 1

Think I have fixed it. Apparently you need use a reader in your store, even if its just a memory one, like this:

var store = Ext.create('Ext.data.Store', {
    autoLoad: true,
    model: 'User',
    data : data,
    proxy: {
        type: 'memory',
        reader: {
            type: 'json'
        }
    }
});

Then it will populate all models, generating its associations without the need for foreign keys.

I’m assuming that without a proxy, the data is loaded in a different way, which does not populate my models.