Possible to upload multiple files?

Questions / Help
,
1

Hi everyone, thanks in advance for your help. Trying to allow users to upload multiple images at once. Based on my research, this is the code I put into my webflow page:

input
type=“hidden”
role=“uploadcare-uploader”
data-multiple=“true”
data-tabs=“file camera url gdrive”
/>

BUT it still didn’t give me an option to do that. Can you please help me here? Can’t figure out why it’s wrong!

Thanks,

2

Hi @Brian , it looks like you’ve added two instances of the widget to your page, and they have different configs.

image
image2130×1542 293 KB

  1. Remove the input with role="uploadcare-uploader" from the before </body> section
  2. Find this script in the <head> 
<script>
UPLOADCARE_PUBLIC_KEY = 'YOUR_PUBLIC_KEY';
</script>

and add UPLOADCARE_MULTIPLE = true;

<script>
UPLOADCARE_PUBLIC_KEY = 'YOUR_PUBLIC_KEY';
UPLOADCARE_MULTIPLE = true;
</script>

Other configuration variables can be added here as well.

Also, add the following script in the before </body> section. It will make the file upload field required and will ensure that the field gets a value once a file(s) is uploaded.

<script>
var widget = uploadcare.Widget("[role=uploadcare-uploader]");
widget.inputElement.type = "text";
widget.inputElement.style = "width:0px;height:0px;border:0;outline:none;";
widget.inputElement.oninvalid = function () {
this.setCustomValidity("This field is required! Upload a file.");
};
widget.inputElement.required = true;

widget.onUploadComplete(function (info) {
// Update widget input's value
widget.inputElement.setAttribute("value", info.cdnUrl);
widget.inputElement.setCustomValidity("");
});
</script>
1 Like
3

It works! Thank you so much for your help!

1 Like