Learn to use Dropdowns using Wix Code (Video)

Ask the community
,
1

Hey all beginners!
There is a lot of users that have asked me to create tutorials for beginners and not coders. So I have listened to you and have started the Wix Code Today series.

The series is shorter videos for beginners using Wix Code.

1940×1154 244 KB

I will try to make a new tutorial every day for you and they are all free for the moment so enjoy.

4 Likes
2

Thank you for that video! Very clear and useful!
I have a question,

I am using WixStores and I have two options for a product. Is it possible to make a dropdown in a Dynamic Page that allows the buyer to choose the option (from WixStores) and buy it?

Do you have any videos published on this subject? or what are the steps (and different videos) you recommend I watch to do this? Thank you very much!

3

Hi Andreas ! i brought your code zip and its awesome thanks.

I know you said no support but how do i add returned values to this code i need an additional 2nd 3rd and 4th value to be returned on the selection of the drop down from my database.

I have it working for 1 field no issues.

Basically i have a diets business and i need to select a food from the drop down and have it return Protein, carbs, fat and calories values on the selection of the dropdown.
here’s where I’m at so far but that value2 doesn’t seem to work

import wixData from ‘wix-data’;

$w.onReady( async function () {
//WORKING WITH DROPDOWNS
$w(“#food1Dropdown”).options = await populateDropdown(“MyFoods”,“protein”, “fat”);
});

export function populateDropdown(collectionName, valueField, valueField2) {
let allItems = ;
return wixData.query(collectionName)
.ascending(“foodType”)
.find()
.then((results) => {
if (results.totalCount > 0) {
let items = results.items;
items.forEach((item) => {
let oneItem = {
label: item.foodType,
value: item[valueField].toString(),
value2: item[valueField2].toString(),
}
allItems.push(oneItem);
})
return allItems;
}
return null ;

})

}

export function food1Dropdown_change(event) {
console.log($w(“#food1Dropdown”).value);
console.log($w(“#food1Dropdown”).value2);
$w(“#protein1Text”).text = $w(“#food1Dropdown”).value.toString()
$w(“#fat1Text”).text = $w(“#food1Dropdown”).value2.toString()
}