Hi All,
I’m pretty much a noob on coding.
Can anyone please help me to set up a dropdown list as filter?
Got my database connected to a repeater, and want to be able to allow user to filtered down by categories.
I’ve tried to search for information but it seems either I’m really bad at googling or there’s not a straight forward solution.
Please advise on this community
Hi Joao,
Welcome to the Wix Code forum.
Take a look at the Example: Search a Database . That should give you a good start.
I hope this helps,
Yisrael
Hi Ysrael
Firstly I must commend you for your promp reply.
Still, I can’t seem to find a way to make it work
Please have a look and tell me what am i doing wrong.
Many Thanks
Joao
Joao,
Please, I need more information. What page? What isn’t working?
Yisrael
Yisrael, that code does not work for 99 percent of sites as the drop downs populate with all duplicates. So if you have a database of all items of different categories, etc it would work, otherwise you get a dropdown menu that is full of duplicates. No one has pointed out a fix despite repeated requests.
@jeff-haskins , perhaps this would help: Example: Remove duplicates from connected dropdown options
Hi @alicihan
Im having some difficuly can u please check and see whats wrong. This is my code…
import wixData from ‘wix-data’ ;
$w.onReady(() =>{
wixData.query( ‘supplierlocations’ )
.find()
.then(res => {
let options = [{ “value” : ‘’ , ‘lable’ : ‘All Countries’ }];
options.push(…res.items.map(country => {
return { ‘value’ :country.title, ‘lable’ : country.title};
}));
$w( ‘#dropdown1’ ).options = options;
})
});
let lastFiltertitle;
let lastFilterCountrty;
let debounceTimer;
export function searchbar_keyPress(event, $w) {
if (debounceTimer){
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w( ‘#searchbar’ ).value, lastFilterCountrty);
}, 200 );
console.log($w( '#searchbar' ).value);
filter($w( '#searchbar' ).value);
}
function filter(title, country) {
if (lastFiltertitle !== title || lastFilterCountrty !== country) {
let newFilter = wixData.filter();
if (title)
newFilter = newFilter.contains( ‘company’ , title);
if (country)
newFilter = newFilter.eq( ‘country’ , country);
$w( ‘#dynamicDataset’ ).setFilter(newFilter);
lastFiltertitle = title;
lastFilterCountrty = country;
}
}
export function dropdown1_change_1 (event, $w) {
filter(lastFiltertitle, $w( ‘#dropdown1’ ).value);
}
However when i run it I always get this error message…
Wix code SDK Warning: The selectOption parameter at index 0 that is passed to the options function cannot be set to [object Object]. Options must contain either a non-null value or a non-null label.
Pleeeese can you help…ive spent hours on this and my wife is going crazy! lol
Thanks
You’ve altered the code from the example, and I don’t know what your database collections are or look like.
Have you tried the example? Does it work? I recommend starting with the example and then adapting the code to your needs.