Cancel an asynchronous jquery file upload during the upload

Question

I need to be able to cancel an upload while it is uploading. I have found https://github.com/blueimp/jQuery-File-Upload/wiki/API#how-to-cancel-an-upload however that depends on you not using the options object. I am using the options object.

When you do

var jqXHR = $('#fileupload').fileupload('send', {files: filesList})

it returns an object you can call .abort() on.

However, when you just use the options object

$('#fileupload').fileupload({url:'...',add: function(e, data){data.submit();}});

then it returns the jquery selector for '#fileupload'

I'm lost as to how to trigger a cancel upload after you do data.submit()

Answer 1

To do this, the object is returned on the data.submit();

$('#fileupload').fileupload({
  url:'...',
  add: function(e, data){
    var jqXHR = data.submit();

    // Setup event handler
    form.find('.cancel_upload').on('click', function(){
      jqXHR.abort();
    });
  }
});

And that is how you can get to the abort method.