Question

I have been assigned a task to upgrade JQuery 1.3.2 to the latest version (currently 1.8.1) all seems to work fine after the upgrade apart from the $.ajax function, the following code calls the server and then execute the call back function doFurtherStuff to perform additional work:

function ChangeContent(url, somepageobject) {
   var xhrobj = $.ajax({
       url: url,
       context: somepageobject,
       callback: doFurtherStuff,
       success: function(data) {
                somepageobject.html($(data));
                this.callback.call(this.context[0], data); // >> Code breaks here
           }
  });
  return xhrobj;
 }

When running this block of code, server data comes back ok but then I get the following error:

IE10 and IE9:

JavaScript runtime error: Unable to get property ‘call’ of undefined
or null reference

Google Chrome:

Uncaught TypeError: Cannot call method ‘call’ of undefined

The object “callback” is undefined in 1.8.1 but all is fine in 1.3.2, I’m happy to change the code if necessary I just can’t figure out a way.

Answer 1

I have to answer my own question since all other solution (while correct) don’t solve my problem without changing the way clients (Callees) communicate and send parameters to the method, I’m unable to do that since I have no control over them (external clients).

All I needed is changing “context” to “thecontext” in the above example to work on JQuery 1.8.1, here is the working code:

function ChangeContent(url, somepageobject) {
   var xhrobj = $.ajax({
       url: url,
       thecontext: somepageobject,
       callback: doFurtherStuff,
       success: function(data) {
                somepageobject.html($(data));
                this.callback.call(this.thecontext[0], data); // >> Code breaks here
           }
  });
  return xhrobj;