Multiple uploads through same form

Archived from the Transloadit support forum. Originally posted on August 13, 2013; details may be outdated, see our docs for current behavior. Original thread

Hi Transloadit,

I really like your service and enjoy using the simple integration through jquery-plugin. But I run into trouble when trying to reuse the same <form> for multiple uploads. My application is a single-page-application and I do not want to reload the page after uploading a file to transloadit.

So I came up with this code:

$form
.attr(“enctype”, “multipart/form-data”)

.transloadit({
wait: true,
autoSubmit: false,
triggerUploadOnFileSelection: true,
onSuccess: function(assembly){
// post "assembly" data to remote server through $.ajax()
}
});

This works fine, but once the file is uploaded to transloadit, all elements in <form> (including the input[type=‘file’]) disappear (css display: none) and it is not possible to upload any further files without reloading the page.

What is the recommended way to upload a file multiple times through the same form without page reload, if this is possible at all.

Any help would be really appreciated.

Best regards,
Jan

Hey Jan,

this is likely a bug. It should only remove the file input fields in the shadow form and not in the real form.

We’ll take a look. Thanks for reporting this.

Kind regards,
Tim

Co-Founder Transloadit
@tim_kos

Hey Jan,

the fix has been shipped. Please clear your browser cache and try again. Then let me know if it works now.

Kind regards,
Tim

Co-Founder Transloadit
@tim_kos

Hi Tim,

I cleared the browser cache and now it works as expected. Thanks!

Regards,
Jan

Most welcome! Thanks for reporting this.

Closed.