Hi all,
I am trying to develop a dropdown list which will direct the user to certain dynamic pages dependent on the choice they make from the dropdown. I am using 2 dropdowns with one of them having conditional filtering in place and the list that appears in dropdown2 being dependent on the choice made in dropdown1 - it is from dropdown 2 that I wish to have the link to other pages created.
I have the conditional filtering aspect working fine but I am struggling to make the selections in dropdown2 redirect me to the relevant url. Below is the full code that I have tried:
import wixLocation from 'wix-location';
import wixData from 'wix-data';
$w.onReady(function () {
uniqueDropDown1();
pageChange();
});
function uniqueDropDown1 (){
wixData.query("NewsMenuDropdown")
.limit(1000)
.find()
.then(results =>{
const uniqueTitles = getUniqueTitles(results.items);
$w('#year').options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.year);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList){
return uniqueList.map(curr => {
return {label:curr, value:curr};
});
}
}
export function year_change_1(event, $w){
uniqueDropDown2();
$w('#dropdown2').enable();
}
function uniqueDropDown2(){
wixData.query('NewsMenuDropdown')
.contains("year", $w('#year').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.monthYear);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr =>{
return {label:curr, value:curr};
});
}
}
function pageChange (){
$w('#dropdown2').onChange((event) => {
let title = $w('#dropdown2').value;
$w('#dataset1').onReady(() => {
console.log("The dataset is ready to be filtered.");
$w('#dataset1').setFilter(wixData.filter()
.eq("monthYear", title)
)
.then(() => {
console.log("Dataset1 dataset is now filtered with the matching title from the dropdown");
let getItem = $w('#dataset1').getCurrentItem();
let url = getItem.url;
wixLocation.to(url);
})
.catch((err) => {
console.log(err);
});
});
});
}
Can anyone point me in the right direction as to what I am doing wrong with this please?
Thanks