Multiple Upload Field: How to customize the list of uploaded files to show only some uploaded files?

Hi,

I want to enable customers to upload multiple files - up to 1000 at a time. And I want them to go to Dropbox (or another service if this is more suitable).

The trouble is, the standard file upload button lists all the files being uploaded, so if there were 1000 files, the user would have an ugly looking page in front of them - and it would also be unreasonably long!

With the drag and drop widget, I've noticed that you can't integrate with dropbox.

Is there a solution you could suggest please?

Many thanks,

Dan

It is possible to make the list of uploaded files scrollable, for example, if the list increases the height of the list will be the same always does not matter the amount of uploaded files and a scroll bar will be shown that will allow your users to check the uploaded files, to achieve it you only need to inject this CSS code: 

[data-type="control_fileupload"] .qq-upload-list{

height:200px;

overflow:hidden; 

overflow-y:scroll;

}

This guide will help you to inject it, paste the given code at the end of all the existing code in your form: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes. 

See the result on this sample form, upload multiple files and see how it works before to apply it to your form: https://form.jotform.com/60826254163959. 

Hope this helps. 

Thanks so much!! You're a legend!

Would it also be possible to control the width and have, say, three columns of uploading files shown?

Also, is there a way to control the number of files a user can upload?

Cheers,

Dan

To achieve that, kindly update the CSS code provided by my colleague, Kevin_G, above and add the codes highlighted in blue.

[data-type="control_fileupload"] .qq-upload-list{

height: 200px;

overflow: hidden;

overflow-y: scroll;

width: 365px;

}

.qq-upload-list li {

display: block;

float: left;

height: 25px !important;

margin-left: 2px;

margin-right: 2px;

margin-top: 0;

max-height: 25px;

width: 100px;

}

Below is a sample form where I have applied the changes.

https://form.jotform.com/60844758687979