Updating Model and store in Ext JS with Comet long polling

Question

I have implement a Comet solution with Ext.Ajax.request() so that when a timeout occurs or a successful response has been received then the same request is re-initialised.

    var http = {

    requestId: 0,
    request: function(timeout){

        Ext.Ajax.request({
            url: '/echo/json/',
            timeout: timeout || 10000,
            method: 'POST',
            scope: http,    // scoped to the http object
            params: {
                json: Ext.encode({ 
                    data: [
                        {
                            id: 1,
                            type: 'notification',
                            timestamp: Ext.Date.format(new Date(), 'timestamp'),
                            from: 1445261,
                            to: 1402804,
                            read: false,
                            important: true,
                            content: 'Lorem ipsum...'
                        } 
                    ]
                }),
                delay: 5
            },
            success: function(resp) {
                if (resp.status === 200){
                    console.log('success');                
                    this.request();   
                }
            },
            failure: function(resp, opts) {
                if (resp.timedout === true) {
                    console.log('failure');  
this.request();                       
                } else {                   
                }
            },
            callback: function(options, success, resp) {
                if (this.requestId === 0) {
                    this.requestId = resp.requestId;
                } 
            }
        }); 

    }

};

http.request();​

I would like to implement this within Ext JS MVC and utilise the native proxy to get the data from the server and load it into the Store via the model.

Looking at the documentation i cannot see how this can be done as you do not seem to have access to the success and failure callbacks as in the Ext.Ajax.request method.

Does anyone know how to implement long-polling with the Ext MVC architecture?

The example code above utilises JSFiddle ajax JSON response echo:

http://jsfiddle.net/Dd8q4/

Answer 1

The way I see it there are 3 ways to go:

1. A more interesting one, clean and perhaps more challenging one would be to extend the proxy class to keep the connection alive. There is an example of proxy extension to work with Flicker API (sencha blog entry). This might help you get started.

2. Parse the response manually and create Model objects from the response data and insert them into your store manually.

3. Use store callback method to perpetually load the store as you do with the Ajax request. Scroll down to Dynamic Loading section of the store API for an example of loading store with callback function. Also there is a load event listener that kicks in after the data is read.