[2.2.1/2.3.0] HttpProxy loosing callback scope

[smudgeface]

Hey all,

been a while since I have posted around these parts. I have picked up development on my web-app and I have stumbled upon what I think is a bug in the latest release of version 2 (2.3.0). It is also present in 2.2.1.

in HttpProxy.load() you will find the following:

load : function(params, reader, callback, scope, arg){
        if(this.fireEvent("beforeload", this, params) !== false){
            var  o = {
                params : params || {},
                request: {
                    callback : callback,
                    scope : scope,
                    arg : arg
                },
                reader: reader,
                callback : this.loadResponse,
                scope: this
            };
            if(this.useAjax){
                Ext.applyIf(o, this.conn);
                if(this.activeRequest){
                    Ext.Ajax.abort(this.activeRequest);
                }
                this.activeRequest = Ext.Ajax.request(o);
            }else{
                this.conn.request(o);
            }
        }else{
            callback.call(scope||this, null, arg, false);
        }
    },

the problem lines are in red. ApplyIf() only copies source-object parameters if the destination-object does not have them defined, and since the destination has the scope hardcoded to this (where this is the httpProxy itself) it is impossible for me to override the callback scope properly. I realize that HttpProxy needs the request to call loadResponse when it is done, but that shouldn't effect the usability of the success/failure callbacks of a standard Ext.Ajax.request.

As a fix, I can make an HttpProxy adding the scope I need as below:

new Ext.data.HttpProxy({
    url: './myScript.php',
    extraScope: this,
    success: function(response, options){
        //do something with success
        options.extraScope.successMethod();
    },
    failure: function(response, options)
    {
        //do something with failure
        options.extraScope.failureMethod();
    }
})

but this is a lame hack. Callbacks that are required internally within HttpProxy should not alter the behavior of a standard Ext.data.Connection. If callbacks are required in httpProxy, they should be constructed with createDelegate

[Animal]

I don't think it's designed to let you do that.

The this.conn is the configuration that the proxy was configured with. It's really just a way of specifying the url, method, timeout, headers.

You are trying to interfere with the HttpProxy's internal usage of Ext.Ajax. It uses success, failure and scope to make its Ajax request and postprocess any response.

[smudgeface]

I can't see where HttpProxy uses success/failure. However, I can see where it uses Callback. How would you recommend to properly handle an application level failure on data loading then? For instance, on my server side I validate all requests based on user permissions. If the user attempts to load data that they have insufficient privileges to view then the following JSON is returned
{
status:0,
message:"some failure message"
data:[]
total:0
}

I then test the status and display an error. In the past, I have used a method of my globally visible application object so scope was irrelevant, however now I am trying to use a handler that is specific to the panel in which the grid is contained. This requires the use of scope.

I could put a callback in the store.load() call, however the arguments given to that callback do not allow access to the actual server response object so any error messages sent from the server are lost. The only place to put this handling (as I see it) is in the actual Connection object...

[Animal]

I can't see where HttpProxy uses success/failure. However, I can see where it uses Callback. How would you recommend to properly handle an application level failure on data loading then? For instance, on my server side I validate all requests based on user permissions. If the user attempts to load data that they have insufficient privileges to view then the following JSON is returned
{
status:0,
message:"some failure message"
data:[]
total:0
}

I then test the status and display an error. In the past, I have used a method of my globally visible application object so scope was irrelevant, however now I am trying to use a handler that is specific to the panel in which the grid is contained. This requires the use of scope.

I could put a callback in the store.load() call, however the arguments given to that callback do not allow access to the actual server response object so any error messages sent from the server are lost. The only place to put this handling (as I see it) is in the actual Connection object...

You're right, it uses calback instead to get control back. Which obviously must be called in its own scope. It has always used the callback option couple with the scope option set to "this".

The 2.0 code is

    load : function(params, reader, callback, scope, arg){
        if(this.fireEvent("beforeload", this, params) !== false){
            var  o = {
                params : params || {},
                request: {
                    callback : callback,
                    scope : scope,
                    arg : arg
                },
                reader: reader,
                callback : this.loadResponse,
                scope: this
            };
            if(this.useAjax){
                Ext.applyIf(o, this.conn);
                if(this.activeRequest){
                    Ext.Ajax.abort(this.activeRequest);
                }
                this.activeRequest = Ext.Ajax.request(o);
            }else{
                this.conn.request(o);
            }
        }else{
            callback.call(scope||this, null, arg, false);
        }
    },

I can see how you'd like to insert your own functionality in there before the Reader got access to the data.

I suggest you use a success option with a createDelegate.