Ext associations

[anarchos78]

Hello,
I have a question: The “associations” feature (HasMany-belongsTo) of ExtJs library is applicable only in nested JSON data? Is it doable to define two different stores with two different data retrieving “urls” (and two different models with the association definition?) and the “hasMany” works? Or, I have to define only one store (with one data retrieving “url” and a JSON output that is nested and reflects the data associations of the database) and then with the help of models “format” the data in a way that Ext can consume?
If the second case it is true, how someone could handle large volume data (let’s say a blog: users=>blog-post=>blog-reply) using the Ext “association” feature?
Sorry for my abstract writing style,
Tom,
Greece

[börn]

erm.... don't understand - can you ask again in a more verbatim style?

[JambaFun]

No problem understanding. Your best bet is to load associated data in a second call. You get stores automatically created on your primary model and these could be loaded separately.

[anarchos78]

Let's give an example:
The post model

Ext.define('app.model.Post', {   extend:'Ext.data.Model',   fields:[     {name:'id', type:'int'},      {name:'title'},     {name:'body'}   ],   proxy:{     type:'ajax',     url:'data/posts.json',     reader:{       type:'json',       root:'posts'     }   },   hasMany:[     {       name:'categories',       model:'app.model.Category'     }   ] })

The Category model

Ext.define('app.model.Category', {   extend:'Ext.data.Model',   fields:[     {name:'id', type:'int'},     {name:'name', type:'string'}   ],   proxy:{     type:'ajax',     url:'data/categories.json',     reader:{       type:'json',       root:'categories'     }   } });

The application:

Ext.Loader.setConfig({     enabled: true });  Ext.application({     name: 'app',     autoCreateViewport:false,     enableQuickTips:false,     requires:[       'app.model.Post',       'app.model.Category'     ],      launch: function() {       app.model.Post.load(1, {  success: function(record, op){    console.log(record.categories())  }       })     } });

The above code block is not working. In my opinion it doesn't work because in the second model i am using a second url to "pull" the data. I think extjs needs a format like:

{   "success":true,   "posts":[     {       "id":1,       "title":"hi",       "body":"there",       "categories":[  {    "id":1,    "name":"hardware"  },  {    "id":3,    "name":"software"  }       ]     },     {       "id":2,       "title":"so",       "body":"long",       "categories":[  {    "id":1,    "name":"hardware"  },  {    "id":2,    "name":""  }       ]     }   ] }

The working code is:
The post model

Ext.define('app.model.Post', {   extend:'Ext.data.Model',   fields:[     {name:'id', type:'int'},      {name:'title'},     {name:'body'}   ],   proxy:{     type:'ajax',     url:'data/posts.json',     reader:{       type:'json',       root:'posts'     }   },   hasMany:[     {       name:'categories',       model:'app.model.Category'     }   ] })

The Category model

Ext.define('app.model.Category', {   extend:'Ext.data.Model',   fields:[     {name:'id', type:'int'},     {name:'name', type:'string'}   ] });

The application:

Ext.Loader.setConfig({     enabled: true });  Ext.application({     name: 'app',     autoCreateViewport:false,     enableQuickTips:false,     requires:[       'app.model.Post',       'app.model.Category'     ],      launch: function() {       app.model.Post.load(1, {  success: function(record, op){    console.log(record.categories())  }       })     } });

and the posts.json file:

{   "success":true,   "posts":[     {       "id":1,       "title":"hi",       "body":"there",       "categories":[  {    "id":1,    "name":"hardware"  },  {    "id":3,    "name":"software"  }       ]     },     {       "id":2,       "title":"so",       "body":"long",       "categories":[  {    "id":1,    "name":"hardware"  },  {    "id":2,    "name":""  }       ]     }   ] }

By using the second (working) code block, I have to pull the whole database in one request! Are there any ideas in how to load what it is really needed?

Thanks

[iesdeveloper]

After retrieving the desired Post record, you need to call .load() again on the record's related categories() store:

app.model.Post.load(1, {
  success: function(record, op){    
    record.categories().load({
       success: console.log(record.categories()) 
    }); 
  }       
});