Valums Ajax Uploader(Mutli) - 检测所有文件上传时 [英] Valums Ajax Uploader (Mutli) - Detect when all files are uploaded

查看:192
本文介绍了Valums Ajax Uploader(Mutli) - 检测所有文件上传时的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Valums Ajax上传器来上传一批文件。我们最近更改了单次上传多上传类型的代码。这引起了我们的代码的问题。



如您所见,当$ code> onComplete 事件触发时,我们重新加载该页面显示新上传的图像。但是,$ code> onComplete 事件似乎是在每个文件完成后触发,而不是整个批次之后。这会导致一个问题,因为当第一个文件完成时,页面重新加载尝试被触发,并且上传者弹出警报如果你离开这个页面,所有的一切都会在剩余的上传中松动 - 或者是这样的事情。 / p>

我注意到 onComplete 事件发回完成文件的基于0的ID,但我不确定如何使用它来确定批次的完成时间。



我猜我的问题是A)当所有文件完成或B)是否有不同的事件触发我确定用户选择了多少个文件,以便跟踪 onComplete 事件有多少个文件已经完成?

  var uploader = new qq.FileUploader({
multiple:true,
element:document.getElementById('file-uploader'),
action:'/projectPhotoUpload.php',
allowedExtensions:['jpg','png','gif'],
debug:tr ue,
params:{id:i},
onComplete:function(id,fileName,responseJSON){
window.location ='projects.php?all = true& tab = 1& sel ='+ currProject;
}
})


解决方案

您可以添加一个上传开始时增加的计数器,并在完成时减少。当计数器为0时,只有重定向才能完成。

  var running = 0; 
var uploader = new qq.FileUploader({
multiple:true,
element:document.getElementById('file-uploader'),
action:'/projectPhotoUpload.php' ,
allowedExtensions:['jpg','png','gif'],
debug:true,
params:{id:i},
onSubmit:function ,fileName){
running ++;
},
onComplete:function(id,fileName,responseJSON){
running--;
if(running == 0) {
window.location ='projects.php?all = true& tab = 1& sel ='+ currProject;
}
}
})


I am using the Valums Ajax Uploader to upload a batch of files. We recently changed the code from a single-upload a multi-upload type. This has raised a problem with our code.

As you can see, when the onComplete event fire, we reload the page to show newly uploaded images. However, the onComplete event seems to be firing after EACH file completes, and not after the entire batch does. This now causes a problem because when the first file finishes, the page reload attempt is fired and the uploader pops up an alert "If you leave this page, all heck will break loose on your remaining uploads" - or something to that effect.

I notice the onComplete event sends back a 0-based ID of the completed file, but I am not sure exactly how to use this to determine when the batch is done.

I guess my question is A) Is there a different event that triggers when all files are complete or B) How do I determine how many files the user has selected, in order to keep track in the onComplete event how many files have completed?

    var uploader = new qq.FileUploader({
        multiple: true,
        element: document.getElementById('file-uploader'),
        action: '/projectPhotoUpload.php',
        allowedExtensions: ['jpg', 'png', 'gif'],
        debug: true,
        params: {id: i},
        onComplete: function(id, fileName, responseJSON){
            window.location = 'projects.php?all=true&tab=1&sel=' + currProject;                                 
        }   
    })  

解决方案

You could add a counter that increments when an upload is started and decrements when complete. Only redirect on complete when the counter is 0.

var running = 0;  
var uploader = new qq.FileUploader({
    multiple: true,
    element: document.getElementById('file-uploader'),
    action: '/projectPhotoUpload.php',
    allowedExtensions: ['jpg', 'png', 'gif'],
    debug: true,
    params: {id: i},
    onSubmit: function(id, fileName){
        running++;                                 
    },
    onComplete: function(id, fileName, responseJSON){
        running--;
        if(running==0){
          window.location = 'projects.php?all=true&tab=1&sel=' + currProject;                                 
        }
    }   
}) 

这篇关于Valums Ajax Uploader(Mutli) - 检测所有文件上传时的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆