Question

I’m new to Extjs 4 and I’m trying to understand how to create a model for data that has nested objects.

Example Data:

{
  data1:{
      field1:1,
      field2:2,

      **objField1**:{
          objField1:1,
          objField2:2,

          **anotherObj**:{
             field1:1,
             field2:2,
             arrayofObjs:[
               {
                 //... 
               },
               //...
             ]
          }
      },

      objField2:{
          //... Some more fields or objects
      },

  data2:{
     //...
  }
}

I’m trying to understand how I would model this data. The fields are easy

Ext.define('MyModel', {
extend: 'Ext.data.Model',
fields: [
    {name: 'field1',  type: 'int'},
    {name: 'field2',   type: 'int'}
], //...

But how do you model the objects? I was thinking I could create a model for the sub-objects and setup associations, but after reading the documentation, they seem to need to have IDs. So if you look at the belongsTo page, “The owner model is expected to have a foreign key which references the primary key of the associated model”.

I’m not looking to model data that has foreignkey relationships, just objects with sub-objects. So the server might return one JSON object with multiple sub-objects, and one of those objects I might want to tie to a grid, another object’s data to a selectbox, etc.

Thanks!

Answer 1

I think you have several problems here.

First, Models in Ext JS are mostly used to represent relational data, i.e. rows in SQL database. You can twist them to do whatever you want, but that doesn’t mean it would be easy and there’s always the question of “what for”.

Second, Ext.data.Model is not suited at all for representing tree-like structures; you can use Ext.data.NodeInterface for that. NodeInterface is kinda class override for Model, a mixin in part, and generally is quite kludgy and rigid thing. The bright side is that it works, and the down side is that there’s no other class that does the same stuff.

Next, nested data objects do not necessarily mean that they’re actually related to each other. You said you want to pluck objects from one global JSON response; this can be done easily by configuring multiple Stores with different Readers and feeding them the same JSON object.

OTOH, the data structure looks a bit convoluted. Is that an attempt at preliminary optimization on the server side? I.e., put all stuff we might need into one huge JSON to save on server hits? If so, take a look at Ext.Direct remoting; it can save you from lots of headache down the road.