Uploadify:如何从队列中删除上传的项目

时间:2013-08-15 21:37:46

标签: jquery uploadify

我尝试上传以清除上传队列以及删除上传的文件。问题是这个。如果我上传了5个文件(其中uploadLimit为5套),则会在第一时间上传。但是如果我使用这个清除队列:

<a class="button" href="javascript:jQuery('#attachment').uploadify('cancel', '*');">Clear Upload Queue</a>

它会从屏幕上直观地删除文件,但我仍然无法再上传任何文件。我尝试使用:

jQuery('#attachment').uploadify('settings', 'uploadLimit', 5)中的

onQueueClear,但它不会重置uploadLimit。队列清除后如何重置uploadLimit?这是我的代码:

jQuery('#attachment').uploadify({
    swf: '/javascript/uploadify/uploadify.swf',
    uploader: '/javascript/uploadify/uploadify.php',
    uploadFolder: 'temp',
    uploadTime: UPLOAD_TIME,
    uploadToken: UPLOAD_TOKEN,
    cancelImage: '/javascript/uploadify/cancel.png',
    fileTypeExts: '*.jpg; *.gif; *.png; *.jpeg; *.doc; *.docx; *.zip; *.pdf; *.xls; *.xlsx; *.JPG',
    fileTypeDesc: 'Allowed Files',
    auto: true,
    multi: true,
    removeCompleted: false,
    simUploadLimit: 1,
    fileSizeLimit: '3MB',
    allowedFiles: '*.jpg; *.gif; *.png; *.jpeg; *.doc; *.docx; *.zip; *.pdf; *.xls; *.xlsx; *.JPG',
    // allowedFiles:    '*.cdt;*.con;*.doc;*.docx;*.dxd;*.gif;*.jpg;*.jpeg;*.key;*.lab;*.mov;*.mp4;*.m4v;*.pdf;*.png;*.pps;*.ppt;*.pptx;*.rst;*.txt;*.wmv;*.xls;*.xlsx;*.zip',
    uploadLimit: 5,
    width: 210,
    height: 40,
    buttonText: 'Click to Add Up to 5 Attachments',
    buttonImage: '/images/content/mail/add-attachments.png',
    onUploadStart: function (file) {
        jQuery('.submit').attr('disabled', 'disabled');

        if (parseInt($.cookie('size')) > 0) {
            $.cookie('size', parseInt($.cookie('size')) + file.size);
        } else {
            $.cookie('size', file.size);
        }

        if (parseInt($.cookie('size')) > 30000000) {
            alert('You have exceeded the maximum queue size.  Please delete one or more files from your upload.  You can clear your queue by clicking the button below.');
            jQuery('#attachment').uploadify('cancel', '*');
        }
    },
    onUploadSuccess: function (file, data, response) {
        jQuery('.submit').removeAttr('disabled');

        try {
            obj = jQuery.parseJSON(data);
            if (obj.success) {
                jQuery('#' + file.id).append('<input type="hidden" name="temp_image_path[]" value="' + obj.file.name + '" /><input type="hidden" name="original_name[]" value="' + obj.file.original_name + '" />');
            }
        } catch (e) {
            // do nothing
        }


    },
    onUploadError: function (file, errorCode, errorMsg, errorString) {
        alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
    },
    onQueueComplete: function () {
        jQuery('.submit').removeAttr('disabled');
    },
    onClearQueue: function (queueItemCount) {
        //jQuery('.submit').attr('disabled', 'disabled');
        var file = (queueItemCount == 1) ? 'file has' : 'files have';
        alert(queueItemCount + ' ' + file + ' been removed from your upload queue.  You have no files pending upload.');
        $.cookie('size', 0);
        jQuery('#attachment').uploadify('settings', 'uploadLimit', 5);
    },
    formData: {
        'filetypes': '*.jpg; *.gif; *.png; *.jpeg; *.doc; *.docx; *.zip; *.pdf; *.xls; *.xlsx; *.JPG',
            'folder': 'temp',
            'time': UPLOAD_TIME,
            'token': UPLOAD_TOKEN
    }
});

2 个答案:

答案 0 :(得分:5)

我也没能找到开箱即用的解决方案。cancel方法仅影响尚未上传的文件。

我建议您可以使用自定义处理程序删除上传的文件(或所有文件)。在unlink附近的某个地方打电话。您可以 - 不要将uploadLimit重置为5,而是将已删除的文件数量增加uploadLimit

但uploadify对象仍然有关于上传文件的信息 - 这意味着如果用户尝试加载相同的文件,他将收到有关重复文件的警告消息。您可以清除此集合:

var files = $('#attachment').data('uploadify').queueData.files = [];
for (var member in files) delete files[member];

从您的代码中使用它可能不正确,但您可以扩展插件。

答案 1 :(得分:0)

正如格林所说,取消方法仅影响尚未上传的文件。

我找到了一种方法来编辑插件用来检查队列是否达到上传限制的值。

$('#attachment').data('uploadify').uploads.count

您可以在删除上传的图片时修改该字段

//on method that removes an image
$('#attachment').data('uploadify').uploads.count--;

从此开始,插件将完成剩下的工作以检查文件队列的大小。此外,我们避免编辑插件选项。