What is the best pattern/practice for saving nested data in ExtJs 4?

I am going to use a simple example: Order & Line Items defined as two models, with Order having one or more Line Items.

The main requirement is this: when I save the Order and its Line Items, they have to be saved as one transaction.

In ExtJs 3 I would define two stores, one for the Order and one for Line Items, I would do an ajax call passing the data from both to a server controller method, and then, on the server side (I use Ext.Net), I would save them in the db using one transaction. This pattern works in ExtJs 4 as well.

Now, in ExtJs 4 we have models that are capable of having relationships :-) so, instead of two stores, I have one store with a HasMany relationship, an Order has many Line Items.

I sort of expected that I can save an Order, and when I save the order, the data from its Line Items models is included as well. That is not what happens from what I've seen debugging store.sync() calls.

One of the things that is not clear to me is how the proxy api calls work as individual http requests in the context where the requirement is that all the row changes (including changes in their associated data) have to be saved as one unit. I guess one could implement the server request handlers to temporarily store the data on the server side, and then when the batch completes, one more call has to be made to persist the data as one unit in a database.

Another idea I tried is to get all the data from the store (including child data) and resolve all the changes on the server side (it is better to do it there anyway just because the data on the client could become stale sooner). There seems to be no extjs method that extracts the store data and follows the HasMany relationships. Something like Writer.getRecordData() that would follow the nested data.

And, as I said, another problem that I see is that, when the child changes, the parent is not marked as dirty, and even if it did, the Writer doesn't seem to include the children in the request that is sent to the server.

Any ideas, comments?

Thanks

Update: Ext.Net has implemented an nice Store API method, getChangedData, that extracts all the changes from a store (not including the nested data though). This allows saving all the row changes in a store (again, not including the children) in one server call.

sample code

A simple workaround

A simple workaround

The workaround I eventually settled on is simpler (with all the good and bad that implies) than the other solutions I've seen to this problem on the forums. Simply put: the parent model has an unused field of type 'auto' with the same name as its associationKey, and there's a beforesync listener on the store that assigns the data from all its dependent records to that field. I also overrode the set() method on the child model to set the parent model dirty if appropriate.

If my data had more than one level of nesting I'd probably scrap this approach in favor of extending Writer, but this was faster for this project.

Thumbs Down

Thumbs Down

This is a surprising oversight for an 'Enterprise' level JavaScript library. Wouldn't it be standard practice to send the whole object to the back end and let the database handle the update in a transaction safe manner?

This is a surprising oversight for an 'Enterprise' level JavaScript library.

I wouldn't be that harsh.

The reason I am saying this, is that saving data highly depends on the server technology. For instance, I am using Ext.Net which is .Net based. The Ext.Net folks have added server extensions that can serialize/deserialize data between json stores (including hierarchical data) and c# objects, which pretty much allows you to save the data in a transaction safe manner (I've done it).

I would also like to add that often it is better to resolve the data changes on the server side (i.e. what has to be updated/deleted/inserted). That's what I always do.