Build a view from json data & have 2 proxies in one store

[neoraptor]

Hello,

First question
I would like to build a view from data comming from JSON.
I intended to store the json data into a model (and cache it) and then build the view from the model.

Is it possible to do?


Second question
I have the following json:

{
    "data":[{"name":"Alice","age":"25"},{"name":"Bob","age":"35"},{"name":"Cedric","age":"45"},{"name":"Delphine","age":"55"},{"name":"Eleonore","age":"65"}],
    "ui":{"button":123,"age":1234}
}

How could I retrieve the data field and the ui field and store each of them in a separate model?
I tried to do it with 2 proxies with different rootProperty, but only the latest one is considered.

    proxy: {        type: 'ajax',
        //url : 'http://localhost:8888/patientData.json',
        url : 'http://localhost:8888/test.php', // with data & ui
        reader: {
            type: 'json',
            model: 'PhoneGap.model.patientUI',
            rootProperty: 'ui'
        }
    },


    proxy: {
        type: 'ajax',
        url : 'http://localhost:8888/test.php', // with data & ui
        reader: {
            type: 'json',
            model: 'PhoneGap.model.patientModel',
            rootProperty: 'data'
        }
    },

Thank you for your support,

[mitchellsimoens]

First question: Yes you can.

Second question: of course that is not going to work, you can't have an object with duplicate properties.

Here is how you can get the ui property:

Ext.define('ModelA', {
    extend : 'Ext.data.Model',

    config : {
        fields : [
            'name',
            'age'
        ]
    }
});

Ext.define('ModelB', {
    extend : 'Ext.data.Model',

    config : {
        fields : [
            'button',
            'age'
        ]
    }
});

Ext.define('Store', {
    extend : 'Ext.data.Store',

    config : {
        uiProperty : 'ui',
        model      : 'ModelA',
        proxy      : {
            type    : 'ajax',
            url     : 'data/json.json',
            reader  : {
                rootProperty : 'data'
            }
        }
    },

    getUI : function() {
        var reader  = this.getProxy().getReader(),
            rawData = reader.rawData,
            fn      = reader.createAccessor(this.getUiProperty());

        return fn(rawData);
    }
});

And the instance:

new Store({
    autoLoad  : true,
    listeners : {
        load : function(store, recs) {
            var ui = store.getUI();

            console.log(ui);
        }
    }
});

[neoraptor]

Thank you for your answer !!

However, in your example you only retrieve the model A from the JSON.
How to retrieve model A & B from JSON data and store them? Do I need to use 2 stores?
Or should I use 1 main model that has 2 submodel (ui and data)?

[mitchellsimoens]

My example you get the object from the ui root, therefore you can create a new model with that object, gotta leave something for you to do

[neoraptor]

Thank you.
I managed to do it meanwhile