Coding dropdown options to page anchor?

Ask the community
1

Hi guys, this is probably easy to do however I have spent 3 days trying to make it work. I’m getting NO code errors on console however nothing is happening. All I am trying to do is link individual drop down options to anchors on the same page. I am by no means a coder and very new to corvid.
the code I have tried is:

777×223 21.9 KB

any advice truly appreciated.

1 Like
2

Yeah, wanted the same thing and HERE’S THE SOLUTION. I tried and tried on my own and ended up hiring a guy to fix it for me. (Best $50 ever spent).

The key is NOT JUST THE CODE. YOU HAVE TO TELL THE ELEMENT TO ATTACH TO THE FUNCTION IN THE CODE.

That means you have to right click on the ELEMENT (in my case the dropdown element in the editor), click “Properties”, and the properties panel comes up.

Then, in the properties panel, next to “onChange” you have to add the name of the function in the code!!!.

In my example, you write dropdown1_change
Press enter.
Now the item is actually attached to the code and it will work!
(just press preview and it will work in preview).

Here is the total code I was using with my dropdown to get it to work.

export function dropdown1_change(event, $w) {
let dropdownSelIndex = $w(“#dropdown1”).selectedIndex;
console.log(dropdownSelIndex);
if (dropdownSelIndex === 0) {
$w(‘#anchor5’).scrollTo();
return ;
}
if (dropdownSelIndex === 1) {
$w(‘#anchor6’).scrollTo();
return ;
}
if (dropdownSelIndex === 2) {
$w(‘#anchor7’).scrollTo();
return ;
}
if (dropdownSelIndex === 3) {
$w(‘#anchor8’).scrollTo();
return ;
}
if (dropdownSelIndex === 4) {
$w(‘#anchor9’).scrollTo();
return ;
}
if (dropdownSelIndex === 5) {
$w(‘#anchor10’).scrollTo();
return ;
}
if (dropdownSelIndex === 6) {
$w(‘#anchor11’).scrollTo();
return ;
}
if (dropdownSelIndex === 7) {
$w(‘#anchor3’).scrollTo();
return ;
}
}

Hope that helps! Enjoy (until Wix wakes up and makes this functionality built in)

Blessings,
Joshua Brown