Uploadify: How to remove uploaded items from queue

Question

I'm trying to Uploadify to clear an upload queue as well as delete the uploaded files. The problem is this. If I upload 5 files (with an uploadLimit of 5 set), they upload the first time. But if I clear the queue using this:

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

it removes the files visually from the screen, but I still can't uploaded any more files. I tried using:

jQuery('#attachment').uploadify('settings', 'uploadLimit', 5) in onQueueClear but it doesn't reset the uploadLimit. How can I reset the uploadLimit after the queue has been cleared? Here is my code:

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
    }
});

Answer 1

I failed to find out-of-the-box solution too.The cancel method affects only not yet uploaded files.

I suggest you can have a custom handler for deleting an uploaded file (or all files). Somewhere near unlink call. And you can - not reset uploadLimit to 5 but increase uploadLimit by removed files count.

But the uploadify object still have information about uploaded files - that means if the user would try to load the same files he will get the warning message about duplicate files. You can clear this collection:

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

It is may be not correct to use it from your code but you can extend the plugin.

Answer 2

As Grin said, The cancel method affects only not yet uploaded files.

I found a way to edit the value that the plugin uses to check if the queue has reached the upload limit.

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

You can edit that field when removing an uploaded image

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

From here on, the plugin will do the rest of work to check the size of the queue of files. Besides, we are avoiding to edit plugin options.