Insert data from UploadButton

Ask the community
,
1

Hey,
I want to insert the uploaded files from an upload button to a database.

I tried a lot but the images doesn’t get uploaded in the database.

 let Url1;
 if ($w("#uploadButton12").value.length > 0) {
                $w('#uploadButton12').startUpload()
                    .then((uploadedFile1) => {
                        Url1 = uploadedFile1.url
                    });
            }
            
 let Url2;
 if ($w("#uploadButton12").value.length > 0) {
                $w('#uploadButton12').startUpload()
                    .then((uploadedFile2) => {
                        Url = uploadedFile2.url
                    });
            }

 let toInsert = {
 "image1": Url1,
 "image2": Url2
            };

            wixData.insert("Items", toInsert)
                .then((results) => {
 let item = results;
                });

I hope you can help me.

2

That’s because you’re not waiting for the promises.
You inserted the data before the image got uploaded.

3

Hey,
I really don’t know how to do that. I tried to set “return;” on different places, it it doesn’t work.

This code works:

 let UrlAussen;
 let UrlZimmer;

 let value1 = $w('#dropdown1').value;
 if (value1 === "Bayern") {

 if ($w("#uploadButton7").value.length !== 0) {
                $w('#uploadButton7').startUpload()
                    .then((uploadedFileAussen) => {
                        UrlAussen = uploadedFileAussen.url;

 if ($w("#uploadButton8").value.length !== 0) {
                            $w('#uploadButton8').startUpload()
                                .then((uploadedFileZimmer) => {
                                    UrlZimmer = uploadedFileZimmer.url;

 let toInsert = {
 "bildAussen": UrlAussen,
 "bildZimmer": UrlZimmer
  };

  wixData.insert("Items", toInsert)
 .then((results) => {
 let item = results;
                                        });
                                });
                        }
                    });
            }

But the problem at this code is, if I don’t upload something on “uploadButton7”, I get no new entry in my database and the upload from “uploadButton8” doesn’t start.

4

@jonatandor35 Ok, I found a way, but I still have a little problem:

$w('#uploadButton9').startUpload()
.then((uploadedFileInnen) => {
                                                        UrlInnen = uploadedFileInnen.url;

console.log("Image 1 uploaded")
})

.then(() => {
 if ($w("#uploadButton12").value.length > 0) {
$w('#uploadButton12').startUpload()
.then((uploadedFileAuto) => {
                                                                    UrlAuto = uploadedFileAuto.url;

console.log("Image 2 uploaded")
})
                                                                .then(() => {

 let toInsert = {
 "bildInnen": UrlInnen,
 "bildAuto": UrlAuto                                          };

wixData.insert("Items", toInsert)
                                                                        .then((results) => {
 let item = results;
                                                                            console.log("Succesfull!");
                                                                        });

The problem is, if “uploadButton12” is empty, the code stops working.

How can I fix this ?

5

When you chain promises you have to return the results.
For example:

return wixData.insert("Items", toInsert)

As for your question, it depends on the flow you want to accomplish.
I don’t know if the 2nd image is optional or required.

6

So I have 6 upload buttons. 4 are required and 2 are optional.

7

@jonatandor35 I really don’t know where to place the promises.
At every position my code get’s red.

8

Ok, I really don’t understand what I did, but I works now:

 if ($w("#uploadButton12").value.length > 0) {
 const Upload = await $w('#uploadButton12').startUpload()
                    .then((uploadedFile) => {
                        Url = uploadedFile.url;

                        console.log("Image uploaded.")

                    })
            }

 let toInsert = {
 "bildAuto": Url
            };

 return wixData.insert("Items", toInsert)
                .then((results) => {
 let item = results;

                    console.log("Alle Daten empfangen!");
                });

This article helped: