Question

I’m trying to make ExtJs work with backend running WCF RIA services with JSON endpoint enabled. The backend I have uses GetXXX for read data and CommitChanges for create/update/delete data. It also has not ExtJs standard message format, so I have store class defined like this:

function cloneObject(src, dst) {
    for (var key in src)
    {
        dst[key] = src[key];
    }


    return dst;
}


Ext.define('MyApp.store.Items', {
    extend: 'Ext.data.Store',
    model: 'MyApp.model.Tax',
    autoLoad: true,
    autoSync: true,    


    proxy: {
        type: 'ajax',
        api: {
            read: '/MyApp/MyAppWeb-Web-MyAppDomain.svc/JSON/GetItems',
            update: '/MyApp/MyAppWeb-Web-MyAppDomain.svc/JSON/SubmitChanges',
            create: '/MyApp/MyAppWeb-Web-MyAppDomain.svc/JSON/SubmitChanges',
            destroy: '/MyApp/MyAppWeb-Web-MyAppDomain.svc/JSON/SubmitChanges'
        },
        reader: {
            type: 'json',
            root: 'GetItemsResult.RootResults',
            successProperty: null,
            totalProperty: 'GetItemsResult.TotalCount'
        },


        writer: {
            type: 'json',
            root: 'changeSet',
            currentOperation: null,


            getRecordData: function(record) {


                var changeSet = [];
                var entity = { 
                    Id: 0, 
                    Operation: 3,
                    Entity: { 
                        __type: 'Items:#MyApp.Web' 
                    },
                    OriginalEntity: {
                        __type: 'Items:#MyApp.Web' 
                    }
                };


                cloneObject(record.data, entity.Entity);
                cloneObject(record.raw, entity.OriginalEntity);
                changeSet.push(entity);


                return changeSet;
            }
        }
    }
});

As you can in order to accomodate Microsoft JSON endpoint format I had to override getRecordData and create custom JSON object. I can probably replace cloneObject function with merge function, right? (I’m still kind of new to ExtJs, so may be I’m trying to “invent a bicycle” here.

It works more or less as expected for update, however for create and delete I need to create slightly different message format. Different Operation code and no need to send OriginalEntity. However inside getRecordData I don’t have information about what kind of operation is being performed. So question #1

What is the best approach here? Override ‘write’ method as well or is there another way?

Question #2. After any update standard store class would call reader in order to parse response, but response for update is very different then response for GetItems and I have no idea how to handle that.

Any suggestions or links to walk-through on how to tie ExtJs and Domain Services?

Answer 1

I ended up re-writing Proxy class to add support for different parsing for read/write operations. Works pretty well. Let me know if somebody else faces same problems – I will post code samples.