Linking a drop down panel to dynamic item page per selection

Ask the community
,
1

I asked this question to wix direct and got a generic reply saying it takes advanced teniques and to ask for help here. So what I would like to do is take a drop down menu that is being populated by a dataset. When an item is chosen it directs to the dynamic item page for that item from the same dataset.

2

Ok, easy pancake. Just go into the Data Collection and get the fieldkey for the field that contains the URL to the Dynamic Pages and the fieldkey for the Title or label you want to show. Post that back here and I will help you do it. Or try yourself with the code below.

export function populateDropdown(collectionName) {
 let allItems = [];
 return wixData.query(collectionName)
    .find()
    .then((results) => {
 if (results.totalCount > 0) {
 let items = results.items;
 items.forEach((item) => {
 let oneItem = {
 label: item.title,
 value: item.fieldKeyWithUrlToDynamicPageHere // Add here
                }
 allItems.push(oneItem);
            })
 return allItems;
        } 
 return null;
 
    })
}

In your page take the dropdown id from the properties panel

$w("#dropdownId").options = populateDropdown("DataCollectionName");

$w("#dropdownId").onChange( (event, $w) => {
  let newUrl = event.target.value;  // "url"
  wixLocation.to(newUrl);
});

Remember to import wixData and wixLocation on top of your page as

import wixData from 'wix-data';
import wixLocation from 'wix-location';

Happy Coding! If you like my answer and it works, please mark it as TOP COMMENT.

3

Thanks for the reply ill try it out and let you know

4

I still need help. I added the code changing what I think is the correct values but still can’t get it to work

5

Try to console.log(newUrl) to see what value you get

6

Hi I’m not a developer so naturally I tried this and didn’t work. Where should I paste it? And should I repeat this for the amount I have in the drop down?
label : item . title ,
value : item . fieldKeyWithUrlToDynamicPageHere // Add here