Is it possible to specify context in callback of a jsonp Ajax call?

Question

Is it possible to specify our specific context in callback of a jsonp Ajax call?

The only way I found to do that is specifying the callback name but not implementing it so the callback go in the success method with the desired context:

    $.ajax({
        type: "GET",
        url: 'someurl',
        dataType: 'jsonp',
        jsonpCallback: 'myCallbackName',
        context: this,
        success: function (response) {
                   console.log(this); //this must be the context specified earlier
        }
    });

The problem is that even if it's working, I receive a lot of errors:

TypeError: myCallbackName is not a function

Any idea of how to achieve this without causing errors?

Thanks

Etienne

Why is the context so important? why can't you just store `this` in another variable? I don't see why you can't just not use jsonpCallback and still use context. My guess is `'someurl'` isn't returning valid jsonp. — Kevin B, Sep 24 '13 at 17:45
I'm firing various time this ajax in different context and managing context in another variable seems a little complicated... — Etienne Desgagné, Sep 24 '13 at 17:49
As mentioned in the question, the ajax call return valid jsonp because everything work... the problem is that the way I'm doing it is a little bit hacky because I specify a callback function that is not implemented to force the callback to be the success method... so the only issue I want to get rid of is the error message... — Etienne Desgagné, Sep 24 '13 at 18:08
Why are you specifying a callback that doesn't exist then? It won't force to the success method. The success method would be called if you didn't specify a call back. So just save the context in a global variable and write the callback function. — CP510, Sep 24 '13 at 18:15
I'm specifying a callback that do not exist to achieve what described here : http://stackoverflow.com/questions/3399997/how-to-pass-object-context-to-jquery-ajax-jsonp-callback — Etienne Desgagné, Sep 24 '13 at 18:44

score 2 · Accepted Answer · answered Sep 24 '13 at 18:22

This should do the trick:

$.ajax({
    type: "GET",
    url: 'someurl',
    dataType: 'jsonp',
    jsonpCallback: 'myCallbackName',
    context: this,
    success: delegate(this, function (response) {
        console.log(this); //this must be the context specified earlier
    })
});

var delegate = function(context, func) {
    return function() {
        return func.apply(context, arguments);
    }
}

However, you get TypeError: myCallbackName is not a function because you don't have myCallbackName defined. Just add

var myCallbackName  = function() { }

P.S. More about delegation in JavaScript here.

I solved my problem creating a function that do nothing like suggested here... The delegate stuff has not been necessary in my case. — Etienne Desgagné, Sep 25 '13 at 13:38

CP510 · Answer 2 · 2013-09-24T18:17:42.310

0

The context can be set in JavaScript by appending a .call([context],[arguments]...) to the end of the call. Such as...

console.log.call(window, this)

That option will fix any Illegal Invocation errors, and comes in a variety of other flavors such as .bind() and .apply().

Your second option if you are just trying to implicitly save an earlier this is to just save it to a variable. A good time to save it is right before the AJAX call, but make sure it's global. I'm not sure why you don't just use the supplied success function given that it will supply the data.

var _this = this;
$.ajax(...);

function myCallbackName() {
   console.log(_this);
}

edited Sep 24 '13 at 18:17

answered Sep 24 '13 at 17:49

CP510

2,297
15
15

But the call to the myCallbackName callback that cause the error is done by the jQuery himself as part of the jsonp mecanism... I'm not triggering it myself... Where should I put that .call(...)? – Etienne Desgagné Sep 24 '13 at 17:54

Is it possible to specify context in callback of a jsonp Ajax call?

2 Answers2