Question

My problem consists of not being able to retrieve data through associations.
After running setup() from console i would expect firstTurbine.getPlant() to return the associated plant, yet it returns undefined.
I’ve spent alot of time looking for a solution I’m probably not looking the right place.

Relevant code is attached below:

Ext.regApplication({
            name: "app",
            launch: function() {
                //app.views.viewport = new app.views.Viewport(); 
            }
});

app.models.Plant = Ext.regModel("Plant", {
    fields: [
        {name: "id", type: "int"},
        {name: "name", type: "string"},
        {name: "notes", type: "auto"}
    ],
    proxy: {type: 'localstorage', id:'plantStorage'}
});

app.models.Turbine = Ext.regModel("Turbine", {
    fields: [
             {name: "id", type: "int"},
             {name: "plant_id", type: "int"},

             {name: "name", type: "string"},
             {name: "notes", type: "auto"}
             ],
    proxy: {type: 'localstorage', id:'turbineStorage'},
    belongsTo: 'Plant'
});

app.stores.plants = new Ext.data.Store({
    model: "Plant",
    autoLoad: true,
    data : [
            {id: 1, name: 'Plant1', notes: ["Note1", "Note2"]},
            {id: 2, name: 'Plant2', notes: ["Note1", "Note2"]},
            {id: 3, name: 'Plant3', notes: ["Note1", "Note2"]}
        ]
});

app.stores.turbines = new Ext.data.Store({
    model: "Turbine",
    autoLoad: true,
    data: [
           {id: 11, "plant_id": 1, name: "T41", notes: ["Turbine note 1", "Turbine note 2"]},
           {id: 12, "plant_id": 1, name: "T13", notes: ["Turbine note 1", "Turbine note 2"]}
          ]
});

function setup(){
    firstPlant = app.stores.plants.getAt(0);
    if(!firstPlant){
        firstPlant = Ext.ModelMgr.create({name:"TestPlant1", id: 1}, "Plant");
      app.stores.plants.add(firstPlant);
      app.stores.plants.sync();
    }

    firstTurbine = app.stores.turbines.getAt(0);
    if(!firstTurbine){
      firstTurbine = Ext.ModelMgr.create({name:"T31", id: 30, plant_id: 1}, "Turbine");
      app.stores.turbines.add(firstTurbine);
      app.stores.turbines.sync();
    }

    return {firstTurbine: firstTurbine, firstPlant: firstPlant};
}

Answer 1

The getter function created by the belongsTo association takes a callback function as argument. The callback function will have the related object as its first argument.

turbine.getPlant(function(Plant){
                console.log(Plant);
            });

I will attach a full working example since this have cost me alot of headache and might have aswell for others.

first the json data:

{
"plants": [{
        "id": 1,
        "name": "Plant1",
        "notes": ["Note1", "Note2"]
    }],
"turbines": [
    {
        "id": 11,
        "plant_id": 1,
        "name": "T41",
        "notes": ["Turbine note 1", "Turbine note 2"]
    }]
}

And the javascript:

Ext.regApplication({
                name: "app",
                launch: function() {}
            });

app.models.Plant = Ext.regModel("Plant", {
    fields: ["id", "name", "notes"],
    proxy: {
        type: 'ajax',
        url: 'data.json',
        reader: {
            type: 'json',
            root: 'plants'
        }
    }
});

app.models.Turbine = Ext.regModel("Turbine", {
    fields: ["id", "plant_id", "name", "notes"],
    proxy: {
        type: 'ajax',
        url: 'data.json',
        reader: {
            type: 'json',
            root: 'turbines'
        }
    },
    belongsTo: 'Plant'
});

app.stores.plants = new Ext.data.Store({
    model: "Plant"
});

app.stores.turbines = new Ext.data.Store({
    model: "Turbine",
    autoLoad: {
        callback: function(records) {
            var turbine = records[0];

            turbine.getPlant(function(Plant){
                console.log(Plant);
            });
        }
    }
});