User input to different databases

Hey,
there’re a lot of tutorials, how to connect text inputs to different databases.

But here’s something more diffucult.
Here’s a example form:


I have 2 databses: Europe and Asia

At the dropdown “Country” you have to select Europe or Asia.
When you select Europe, your name should be importet in the Europe database.
When you select Asia, your name should be importet in the Asia database.

Is there any code, to switch the databases ?

I think, it should be like this- >

There are 3 dropdowns.
The options of the 1st dropdown are - ‘Europe’ and ‘Asia’.
When the user selects Europe, the data entered in the Full Name input and Last name input should be inserted in the ‘Europe’ datasbase.
When the user selects Asia, the data entered in the Full Name input and Last name input should be inserted in the ‘Asia’’ datasbase.

If this is the condition you don’t have to connect neither the dropdown nor the inputs to the dataset , you can do this →

#dropdown1 - the dropdown which has the options -Asia and Europe.
#input1 - The Full Name input.
#input2 - The last Name input.
#submitButton - Submit Button.

import wixData from'wix-data';
$w.onReady(function () {

$w('#submitButton').onClick( (event) => {  //submit Button
 
 let value1 = $w('#dropdown1').value;
 if(value1 === "Asia"){
 
let toInsert = {
  "fieldName":        $w('#input1').value,
  "fieldName":   $w('#input2').value

};

wixData.insert("Asia", toInsert)
	.then( (results) => {
		let item = results; 
		console.log("Inserted to DB Asia");
	});
 
 } else { 
 
 let toInsert = {
  "fieldName":        $w('#input1').value,
  "fieldName":   $w('#input2').value

};

wixData.insert("Europe", toInsert)
	.then( (results) => {
		let item = results; 
		console.log("Inserted to DB Europe");
	});
 
 }
});

});

Hey,
thanks for the Code, it works :grin:
But the new entries are on the live database. Is there a way to insert them into the Sandbox ?

And one more question.

Which code do I have to use, if I want to insert an image from an upload button ?
For text fields you use this code:

"fieldName":   $w('#input2').value

@nickoertel If your are in the preview mode, the data will be inserted to sandbox only!!!

@nickoertel For inserting image the code would be more like →

$w('#submitButton').onClick( (event) => { 
  $w('#uploadButton1').startUpload()
   .then( (uploadedFile) => {
   let url =  uploadedFile.url
   
   let toInsert = {
  "fieldName":       url
 
 };
  });

or you can add a image in your page and →

#image1 - image

$w('#submitButton').onClick( (event) => { 
  $w('#uploadButton1').startUpload()
   .then( (uploadedFile) => {
   $w('#image1').src = uploadedFile.url
   let toInsert = {
  "fieldName":      $w('#image1').src
 
 };
   
  });

@ajithkrr No worries, I’m going to mark your answer as best :slight_smile:
If I’m in preview mode, the data will be insert in Sandbox,
but another user won’t use my page in preview mode, so I need a way to insert the data from the public page to Sandbox and not in Live.

You know how to do that ?

@nickoertel I don’t think there is a feature like that

Instead of separate database collections, I would suggest using one collection with a field called continent . It will make your database queries simpler to write and understand and will therefore greatly simplify your code and make it easier to maintain.

Yeah !!! That would be nice!!

@nickoertel Preview (and the sandbox database collections) are only development and testing. Your “real” data will be in the Live database.

When you run your site in Preview, user data will be added to the sandbox database. When you run your Live site, user data will be added to the Live database.

If you need, you can sync your sandbox database to the Live. This copies what’s in the sandbox to the Live database.

Yeah, of course that would be much easier, but it’s important, that I have serveral databases.
I have a page where you see all names from Europe and a page with all names from Asia. Then I make a field (continent) in the database and set a database filter on it.

But I use this databases for some more complicated things.
(I don’t use the names, that was just a simple example).

@yisrael-wix Yes, but I want to prove the entries bevore they go live.

@nickoertel It’s really easier to user one collection. If you’re on the page for Europe, then make sure you include a filter for Europe, and likewise for Asia.

But it’s up to you. I’m just trying to explain best db design practices to make your site easier to develop.

Yes, but I want to prove the entries before they go live.
If you need an approval system, then add a field called status or any other in the same db(s).

Then, on the insert code, add the bold(ed) line

let toInsert = {
  "fieldName":        $w('#input1').value,
  "fieldName":   $w('#input2').value,
  "status" : "Pending"
};

Yes, thanks! That’s the idea, I made it just a little bit easier.

I created a new boolean field in the database (Genehmigt = approved)

Then I set a database filter on all my pages, that just show all entries, that have this checkbox checked.

When someone uploads a new entry, this checkbox is missing and isn’t displayed. And you can see all new entries immediately.

As we say in Germany: You’re a fox!

@ajithkrr Hey, one more question.

Everything works fine, exept the upload buttons.
When I leave one button empty, the code stops and the entry doesn’t get uploaded.


Do you know how I can fix this ?

@nickoertel Can you share your code…~

@ajithkrr Yeah, thanks. Here’s my code.
For sure I added the code for the pictures wrong.

import wixData from 'wix-data';

$w.onReady(function () {

    $w('#button1').onClick((event) => {

 let value1 = $w('#dropdown1').value;

 if (value1 === "Bayern") {

            $w('#uploadButton7').startUpload()
                .then((uploadedFileAussen) => {
 let UrlAussen = uploadedFileAussen.url

                    $w('#uploadButton8').startUpload()
                        .then((uploadedFileZimmer) => {
 let UrlZimmer = uploadedFileZimmer.url

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

                                    $w('#uploadButton10').startUpload()
                                        .then((uploadedFileLadestation) => {
 let UrlLadestation = uploadedFileLadestation.url

                                            $w('#uploadButton11').startUpload()
                                                .then((uploadedFileLogo) => {
 let UrlLogo = uploadedFileLogo.url

                                                    $w('#uploadButton12').startUpload()
                                                        .then((uploadedFileAuto) => {
 let UrlAuto = uploadedFileAuto.url

 let toInsert = {
 "bildAussen": UrlAussen,
 "bildZimmer": UrlZimmer,
 "bildInnen": UrlInnen,
 "bildLadestation": UrlLadestation,
 "bildLogo": UrlLogo,
 "bildAuto": UrlAuto,
 "title": $w('#input1').value,
 "shortDescription": $w('#textBox7').value,
 "longDescription": $w('#textBox2').value,
 "eMailAdresse": $w('#input2').value,
 "neuesFeld": $w('#input3').value,
 "facebook": $w('#textBox4').value,
 "instagram": $w('#textBox5').value,
 "youTube": $w('#textBox6').value,
 "ansprechpartner": $w('#input5').value,
 "adresse": $w("#input6").value,
 "eAutoInfos": $w('#input7').value,
 "ladestationenInfos": $w('#textBox3').value
                                                            };

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

@nickoertel The code stops, if the upload button is empty in your code->
Try this_->

import wixData from 'wix-data';

$w.onReady(function () {

    $w('#button1').onClick((event) => {
 var UrlAussen;
 var UrlZimmer;
 var UrlInnen;
 var UrlLadestation;
 var UrlLogo;
 var UrlAuto;

 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
                    });
            }

 if ($w("#uploadButton9").value.length > 0) {
                $w('#uuploadButton9').startUpload()
                    .then((uploadedFileInnen) => {
                        UrlInnen = uploadedFileInnen.url

                    });
            }

 if ($w("#uploadButton10").value.length > 0) {

                $w('#uploadButton10').startUpload()
                    .then((uploadedFileLadestation) => {
                        UrlLadestation = uploadedFileLadestation.url

                    });
            }
 if ($w("#uploadButton11").value.length > 0) {

                $w('#uploadButton11').startUpload()
                    .then((uploadedFileLogo) => {
                        UrlLogo = uploadedFileLogo.url

                    });
            }
 if ($w("#uploadButton12").value.length > 0) {

                $w('#uploadButton12').startUpload()
                    .then((uploadedFileAuto) => {
                        UrlAuto = uploadedFileAuto.url

                    });
            }

 let toInsert = {
 "bildAussen": UrlAussen,
 "bildZimmer": UrlZimmer,
 "bildInnen": UrlInnen,
 "bildLadestation": UrlLadestation,
 "bildLogo": UrlLogo,
 "bildAuto": UrlAuto,
 "title": $w('#input1').value,
 "shortDescription": $w('#textBox7').value,
 "longDescription": $w('#textBox2').value,
 "eMailAdresse": $w('#input2').value,
 "neuesFeld": $w('#input3').value,
 "facebook": $w('#textBox4').value,
 "instagram": $w('#textBox5').value,
 "youTube": $w('#textBox6').value,
 "ansprechpartner": $w('#input5').value,
 "adresse": $w("#input6").value,
 "eAutoInfos": $w('#input7').value,
 "ladestationenInfos": $w('#textBox3').value
            };

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

        }

    });
});