jQuery File Upload: clean file queue

Question

I am using JQuery File Upload in my app and, every time that I add and upload a file, it uploads again the ones that were added in the past. This is the function that I call every time I need to add a new file. Is there a way to empty the file queue after a successful upload?

$(this).fileupload({
        // This function is called when a file is added to the queue;
        // either via the browse button, or via drag/drop:
        replaceFileInput: false,
        autoUpload: false,
        add: function (e, data) {

            // Automatically upload the file once it is added to the queue
            submitBtn.click(function()
            {
                beforeSubmit(function(token, card_side){ input_token.val(token); input_card_side.val(card_side);});
                var jqXHR = data.submit();              
            });
        },
        done: function(e, data)
        {
            try
            {
                var result = typeof data.result == 'string' ? data.result : data.result[0].body.innerHTML;
                $("#fileInputId").replaceWith($("#fileInputId").val('').clone(true));
                callBack(JSON.parse(result));
            }
            catch( e )
            {
                callBack({"result" : "false", "reason" : "Error: " + data.result});
            }
        },
        fail: function(e, data){
            // Something has gone wrong!
            callBack({"result" : "false", "reason" : "server internal error"});
            data.context.addClass('error');
        }

    });

Answer 1

You can use this one liner inside your done method to clear the file/files:

$("#fileInputId").replaceWith($("#fileInputId").val('').clone(true));