Hello all. I am trying to auto populate my dropdown from my datacollection, also remove duplicates and list the options in the dropdown in alphabetical order. To this point all is working. However, when I arrive at the page, the gallery, I thought would filter to the first auto pre-populated option in the dropdown, however this is not the case. Any suggestions as to how I can have this page on-load, follow the filter instructions that are set by the dropdown. It works correctly if I manually choose a different option from the dropdown and even go back to the original option, it just does not work on the initial arrival to the page, rather it displays all non filtered content in the gallery. Please know I am not a coder and am learning now with this website. I have been watching youtube and using google to come up with what I have so far. Thank you in advance.
Here is the code I have so far…
import wixData from ‘wix-data’;
$w.onReady( function () {
//TODO: write your page related code here…
});
//Code to populate the birds dropdown
$w.onReady( function () {
uniqueDropDown1();
});
function uniqueDropDown1 (){
wixData.query(“gallery”)
.ascending(‘subCategory2’)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w(“#birdsDropdown”).options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.subCategory2);
return [… new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return {label:curr, value:curr};
});
}
}
//code to make the dropdown filter the gallery
export function birdsDropdown_change(event) {
let birdsSubcat = $w(‘#birdsDropdown’).value;
$w(‘#birdsDataset’).setFilter(wixData.filter().contains(‘subCategory2’, birdsSubcat))
}