Error Uploading 5 Images

Ask the community
,
1

I have 5 file uploaders on my site, in which they are all required. The site is www.SpinTopSigns.com . I have 1 button to start the upload. I want to provide progress to the user after each file gets uploaded, but I keep receiving “No File To Upload” after the first file is uploaded.

Thanks for the help

export function button1_click(event, $w) {
console.log('submit clicked')
if ($w('#nameTextBox').valid &&
$w('#emailTextBox').valid &&
$w('#addressTextBox').valid &&
$w('#bedsTextBox').valid &&
$w('#bathsTextBox').valid &&
$w('#sqftTextBox').valid &&
$w('#installDatePicker').valid &&
$w('#descriptionTextBox').valid &&
$w("#uploadButton1").value.length > 0 &&
$w("#uploadButton2").value.length > 0 &&
$w("#uploadButton3").value.length > 0 &&
$w("#uploadButton4").value.length > 0 &&
$w("#uploadButton5").value.length > 0 &&
$w('#hearAboutUsDropDown').valid) {
console.info('Form is valid');
$w('#uploadProgressBar').show();
$w('#uploadProgressBar').targetValue = 5;
$w('#uploadProgressBar').value = 0;
$w('#loadingImage1').show();
$w('#loadingImage6').show();
$w("#uploadButton1").startUpload()
.then((uploadedFile1) => {
console.info('Uploaded file 1');
$w('#uploadProgressBar').value = 1;
$w('#loadingImage1').hide();
$w('#loadingImage2').show();
$w("#uploadButton2").startUpload()
.then((uploadedFile2) => {
console.info('Uploaded file 2');
$w('#uploadProgressBar').value = 2;
$w('#loadingImage2').hide();
$w('#loadingImage3').show();
$w("#uploadButton3").startUpload()
.then((uploadedFile3) => {
console.info('Uploaded file 3');
$w('#uploadProgressBar').value = 3;
$w('#loadingImage3').hide();
$w('#loadingImage4').show();
$w("#uploadButton4").startUpload()
.then((uploadedFile4) => {
console.info('Uploaded file 4');
$w('#uploadProgressBar').value = 4;
$w('#loadingImage4').hide();
$w('#loadingImage5').show();
$w("#uploadButton5").startUpload()
.then((uploadedFile5) => {
console.info('Uploaded file 5');
$w('#uploadProgressBar').value = 5;
})
.catch((error) => {
console.log(`Error 5: ${error.errorCode}`);
console.log(error.errorDescription);
})
})
.catch((error) => {
console.log(`Error 4: ${error.errorCode}`);
console.log(error.errorDescription);
})
})
.catch((error) => {
console.log(`Error 3: ${error.errorCode}`);
console.log(error.errorDescription);
})
}).catch((error) => {
console.log(`Error 2: ${error.errorCode}`);
console.log(error.errorDescription);
})
})
.catch((error) => {
console.log(`Error 1: ${error.errorCode}`);
console.log(error.errorDescription);
})
}
}
2

Have you read the Wix pages about using the Wix Upload Button itself?
https://support.wix.com/en/article/adding-and-setting-up-an-upload-button

With it’s own UploadButton API.
https://www.wix.com/corvid/reference/$w.UploadButton.html

UploadButton
An upload button enables users to upload files to your site.

Typical File Upload Scenario
In a typical scenario, the page from which files are uploaded contains an upload button and another element, such as a regular button. The user chooses which file to upload by clicking the upload button and selecting the file in a native file chooser dialog. At that point the file is stored in the upload button’s value property as a File object. Then the user triggers an event, such as a button click, on the other element. That element’s event handler calls the startUpload() function to perform the actual upload. The upload either succeeds and gives you an UploadedFile object, or fails and gives you an UploadError object.

And the options that you have when you want to use it in code like in this example here?
https://support.wix.com/en/article/wix-code-using-the-upload-button-with-code

As for your submit bar for loading of the photos, you can do something as simple as this too.
Add a Preloader to your WiX Site in 4 min’s!

3

Hello GOS,
Thanks for the response. Yes, I did read through the documentation. Once the first file successfully has been uploaded, it seems like the state of the form is lost, and it can’t upload the second file, even though the user has selected a file for the second uploader.

Zack

4

Hi, I have the same problem - first time succeeds, after that keep getting “No File To Upload” error code…
Any help??