Search code examples
jqueryajaxfile-uploaddrupal-6

Abort fileupload with jQuery 1.2

I'm developing modules for an older Drupal 6 website. The current task is to abort the preview generation of custom posters. For this the user can upload his logo and change some text. The form containing these info is submitted and the preview is displayed via ahah.

According to several tutorials I have to do this:

var xhrPool = [];
$(document).ajaxSend(function(e, jqXHR, options){
  console.log(jqXHR);
  xhrPool.push(jqXHR);
});
$(document).ajaxComplete(function(e, jqXHR, options) {
  xhrPool = $.grep(xhrPool, function(x){return x!=jqXHR});
});

and later on:

function abortAll() {
  hideEverything();
  for (var i = xhrPool.length - 1; i >= 0; i--) {
    xhrPool[i].abort();
  };
}

In case I enter information in all fields except the fileupload, the log returns a valid XmlHttpRequest Object which can be aborted properly. But if I upload a file the .ajaxSend does not contain a valid XmlHttpRequest Object. Example:

Returned object

This object does not contain the .abort() method and causes a "method not found" error. So how can I abort this call?

jQuery Version is 1.2.6 and can not be updated. The solution has to be cross browser compatible.

Solution

  • A working solution could be the following (I happen to have had the same problem with Drupal 6, Jquery 1.2):

    for (var i = xhrPool.length - 2; i >= 0; i--) {
  if (xhrPool[i] instanceof XMLHttpRequest) {
    xhrPool[i].abort();
  } else {
    window.stop();
  }
};

    In this case you simply check if you have a proper XMLHttpRequest and do it the normal way if yes. And if you don't, you simply abort ALL running Requests.

    It's not perfect, but it works approx 90% of the time.