...
The bulk download file attachments function discussed in this article is achieved through the use of Custom HTML form element and Javascript codes. It will download all file attachment of the File Upload form element at a click of a button.
Get Started
| Warning |
|---|
Be aware that this only serves as a temporary solution.solution comes with the following limitation:
Please keep this in mind when utilizing this feature. |
Step Examples
Step 1
Drag a File Upload element into the form, ensure the "Enable Multiple File Upload" is enabled in order for bulk download to work.
Figure 1: Enable multiple files upload
Step 2
Drag a Custom HTML element into the custom HTML into the designated form
...
Figure 2: Custom HTML
Step 3
Paste the following code. This will add a download all button to the form to perform bulk download files.
| Code Block | ||
|---|---|---|
| ||
<div id="download-all" class="btn btn-primary">Download All</div>
<script>
$(function(){
searchParams = new URLSearchParams(window.location.search) // to check the mode
mode = searchParams.get("_mode");
if(mode == 'add'){// hide if its "add" mode
$('#download-all').hide();
}
$('#download-all').on('click', function(){
links = $("ul.form-fileupload-value").find("a:not(.remove)"); // get all <a> tag except those with "remove" class
$.each(links, function(k,v){ // iterate through them 1 by 1, while using click() on them.
v.click();
})
})
});
</script> |
Figure 3: Insert code into Custom HTML
Step 3
Test the plugin at runtime
run time
Figure 4: "Download All" button testing
Step 4
Check Results
Bulk download result
Figure 5: Download result
Sample App
| View file | ||||
|---|---|---|---|---|
|