ExtJS 4: Models with Associations and Stores

Question

Introduction

I\'m facing an application design problem with the Ext.data.Model class in ExtJS. I will try to develop my ideas to a very common online

Answer 1

Please note that your assumption:

(Customer)1-n(Order)1-n(Product)

is wrong. Your actual model should be:

(Customer)1-n(Order)n-n(Product)

That's why you found also difficulties in modeling it with hasMany-belongsTo

Answer 2

It all works fine in ExtJS 4, it is just hard to get right the first time. Well, the first few times.

Yes, you can avoid specifying the belongsTo association of the child, and still use it in a Has Many relationship.

In my project, we have dozens of models, many with deep relationships, and it works great.

Regarding Many-Many relationships, you should either have

Customer -< CustomerOrder >- Order

Which is three models,

Or you can "fake" it by doing a bunch of work on the server to pretend that a customer HasMany Orders. Nested json can help here.

Answer 3

i fully agree with Molecular Man. By reading the ExtJS documenation it appeared more as evidence that this is a good route when you are making use of a tree set structure distributed to different stores. Frankly, this all could be true only if such association had in any way a reference of stores to make calls. That's not the case from what I have tested. Model associations don't have such relationship. Filtering is the best way to keep up with sequentially updating other grids whose models depend on others.

Answer 4

Konrad. I recently faced with dealing with Models+Associations+Stores. This wasn't very pleasent experience. Here is what I've learned:

Let's say we have Store1, Store2, Model1, Model2, Grid1, Grid2. Grid1 uses Store1, Store1 uses Model1 and similarly Grid2 uses Store2, Store2 uses Model2.

So far all is working, data is loading and so on.

But now we want to add hasMany association to Model1. Ok, we are adding to Model1's config:

hasMany: {model: 'Model2', name: 'model2'}

After this you think that you can populate Store2 with data on Grid1's itemclick by doing something like following:

Grid1.on('itemclick', function(view, item_which_uses_model1){
  //item_which_uses_model1.model2() supposed to return Model2's store
  item_which_uses_model1.model2().load();
}

You are expecting that Grid2 is populated with data on Grid1's itemclick. But nothing happens. Actualy requests are being posted, responses are gotten. But Grid2 is not populated with data.
And after some time you are realising that item_which_uses_model1.model2() IS NOT Store2.

when Model2 "sees" that it has association with Model1 it creats Model1's own store which is not equal to Store2.

It's not cool, because Grid2 is using Store2.

Actualy you can hack it by, for example, adding to Grid2's config:

store: new Model1().model2(),

but what if you are using ExtJS mvc pattern. Grid2 doen't have to know anything about Model1.

I don't recommend using associations in real world projects. At least now. Instead use approach which is shown in your example: Model+Store+Filtering.