Dropdown depending on another dropdown

Ask the community
,
1

Hello everyone, I was wondering how I could do a dropdown that depends on another one.
Example :
Dropdown 1 : Icecream/CarParts
Dropdown 2 : If you select Icecream it’ll have Strawberry/Chocolate/Vanilla etc…
If you select CarParts it’ll have Motor/Battery/Seat etc…
Can someone please help me. (Also sorry for asking so many questions)

2

See the Cascading Form example .

3

I don’t understand how it works and what I need to replace.

4

@tyouking1 I would suggest you open the example in the editor and play with it. You will need to familiarize yourself with basic coding concepts to accomplish what you want. Refer to the links I posted in the other thread for more information about programming in Wix Code and Javascript.

5

cascading form example . in corvid vy wix is not working, can i find in another place?

6

It is working. I have implemented it last week over here https://www.careerstork.com/jobs

Do you mean that you are not able to open the example and see the code?

7

Hi Shan , nice to talk to you. I have checked your site , that’s the idea I want. The problem is: I choose the choice in the first dropdown, I choose the choice in the second dropdown, but it doesn’t give me the answer, I do not get the items I have chosen it does nothing. Eg: in your website I choose Australia in the first dropdown, I choose new South Wales in the second dropdown and it gives a result. The problem I have is I do not get any result. This is my wix code:
import wixData from ‘wix-data’;

$w.onReady( function (){
uniqueDropDown1();
});

function uniqueDropDown1 (){
wixData.query(“SoCollection”)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w(‘#dropdown1’).options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items){
const titlesOnly = items.map(item => item.soCategory);
return [… new Set(titlesOnly)];
}
function buildOptions(uniqueList){
return uniqueList.map(curr =>{
return {label:curr, value:curr};
});
}
}

export function dropdown1_change(event, $w){
uniqueDropDown2();
$w(“#dropdown2”).enable();
}

function uniqueDropDown2 (){
wixData.query(“SoCollection”)
.contains(“soCategory”,$w(“#dropdown1”).value)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w(‘#dropdown2’).options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items){
const titlesOnly = items.map(item => item.section);
return [… new Set(titlesOnly)];
}
function buildOptions(uniqueList){
return uniqueList.map(curr =>{
return {label:curr, value:curr};
});
}
}

8

Is it possible to use content manager rather than manually writing code?