添加取消上传或中止功能引导多个文件上传插件 [英] Add cancel upload or abort functionality to bootstrap multiple file upload plugin

问题描述

我使用引导多个文件上传插件上传文件。我正在使用此链接上的示例。现在我想添加另一个按钮取消上传除了添加文件按钮。点击取消上传按钮后，应停止上传过程。请帮我解决这个问题。谢谢

解决方案

最后，经过大量的试验和错误，寻找相关的代码解决方案，我得到了正确的工作方式！我在插件的github问题页上发布了我的查询，并从那里获得了帮助。

下面是真正起作用的代码示例：

1.首先必须绑定fileuploadadd事件：

$ b $ pre $ $（'＃fileupload'）。bind（'fileuploadadd'，function（e，data）{
var jqXHR = data .submit（）; //捕获每个文件的上传过程
$（'＃cancel_all'）。on（'click'，function（e）{
jqXHR.abort（）;
}）;
}）;

2.然后您必须绑定在点击取消上传按钮，它将取消所有正在上传的文件：

  $（'＃fileupload'）。bind（'fileuploadfail'，函数（e，data）{
 if（data.errorThrown ==='abort'）
 {
 //这里有一些用户的反馈
} 
 }）; 
  

I am using bootstrap multiple file upload plugin to upload file. I am using the example that is on this link. Now I want to add another button "Cancel upload" besides the "Add files" button. On clicking the "Cancel upload" button the uploading process should be stopped. Please help me out to get around this issue. Thanks

解决方案

Finally, after extensive trials and errors and searching for relevant code solutions, I got it working exactly the way I wanted ! I posted my query on the plugin's github issue page and got the help from there.

Below is the code sample that really worked :

1.First you have to bind the fileuploadadd event:

$('#fileupload').bind('fileuploadadd', function(e, data){
      var jqXHR = data.submit(); // Catching the upload process of every file
      $('#cancel_all').on('click',function(e){
            jqXHR.abort();
      });
});

2.Then you have to bind the cancel event that will be called when clicking the "Cancel Upload" button, which will cancel all the file currently being uploaded :

$('#fileupload').bind('fileuploadfail', function(e, data){
    if (data.errorThrown === 'abort')
    {
        //PUT HERE SOME FEEDBACK FOR THE USER
    }
});

这篇关于添加取消上传或中止功能引导多个文件上传插件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！