Ext.data.proxy.Ajax and WCF services via JSON

[f20]

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?

[mitchellsimoens]

You could do this in the writeRecords method as write will just build the data and then execute writeRecords.

[f20]

You could do this in the writeRecords method as write will just build the data and then execute writeRecords.

Thank you for you answer. But that's exactly the point. In writeRecords I will have already incorrectly formatted records, correct? Or you're saying do everything in writeRecords (formatting too)?

What about the second part of the question? Is there way to manage different response formats for get/update?

[f20]

Ok, so I managed to make it work doing the following:

- Extended Ext.data.writer.Json by saving current operation in write() method, and then creating Microsoft required JSON objects in getRecordData()

- Extended Ext.data.proxy.Ajax by adding new config property 'readerOnCommit' and then making sure in processResponse() function that we use different readers based on action (default reader when we do 'read' and readerOnCommit when we do all other three actions)

Is it acceptable or are there easier ways ti accomplish same goal?

[Marouene]

Could you please < f20 > publish for us the final code that resolved your issue thanks in advance <f20>

Ok, so I managed to make it work doing the following:

- Extended Ext.data.writer.Json by saving current operation in write() method, and then creating Microsoft required JSON objects in getRecordData()

- Extended Ext.data.proxy.Ajax by adding new config property 'readerOnCommit' and then making sure in processResponse() function that we use different readers based on action (default reader when we do 'read' and readerOnCommit when we do all other three actions)

Is it acceptable or are there easier ways ti accomplish same goal?

[f20]

At this point the code went long way since original question and it will be hard to post something relevant right now. Feel free to ask particular questions if you have any.

[Marouene]

Thanks <f20> Best Regards.

[Marouene]

I mean how we can use these APIs declared (read, update, create and destroy)??
You can present some examples for me
Thanks in advance dear <f20>
King Regards.

At this point the code went long way since original question and it will be hard to post something relevant right now. Feel free to ask particular questions if you have any.