Bulk Download File Attachments

Introduction

It's possible to enable the bulk download of file attachments with a Custom HTML form element and JavaScript codes. Allowing you to download all file attachments from the File Upload form element with a single click of a button.

How does it work?

To add this feature to your form, follow the steps below:

1. Access the form you want to configure.
2. Drag a File Upload element into the form.
3. Open its configuration and go to Advanced Options.
   
   
4. In the UI section, check the Enable Multiple File Upload option.
   
5. Drag a Custom HTML element into the form.
6. Paste the code below to add a Download All button to the form for bulk file downloads.

   <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>

   

7. Apply your changes and preview your form to test it.

Related documentation

• File Upload
• Custom HTML

Download sample app