Filter a Data Set with a Dropdown

Ask the community
, ,
1

Hey All,
I am trying to filter a dataset by day of the week with using the code attached… I used this video as a guide.

However, the “All Days” function (equivalent to all continents in the video) just shows no results. My code is below, any ideas? Thanks in advance.

$w.onReady(() => {
wixData.query(‘days’)
.find()
.then(res => {
let options = [{“value”: ‘’, ‘label’: ‘All Days’}];
options.push(…res.items.map(day => {
return {“value”: day.title, ‘label’: day.title};
}));
$w(‘#dropdown1’).options = options;
})
});

let lastFilterTitle;
let lastFilterDay;

let debounceTimer;
export function input1_keyPress_1(event, $w) {
if (debounceTimer){
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#input1’).value, lastFilterDay);
}, 200);

}

function filter(title, day){
if (lastFilterTitle !== title || lastFilterDay !== day) {
let newFilter = wixData.filter();
if (title)
newFilter = newFilter.contains(‘restaurant’, title);
if (day)
newFilter = newFilter.eq(‘day’, day);
$w(‘#dataset1’).setFilter(newFilter);
lastFilterTitle = title;
lastFilterDay = day;
}

}

export function dropdown1_change(event, $w) {
filter(lastFilterTitle, $w(‘#dropdown1’).value);
}

2

Hi,

Welcome to the Wix Code forums.

If you are filtering according to a specific day, then the filter will use the day string (e.g. “Monday”). However if you want all day, then you don’t want a filter at all. You should then just clear the filter:

$w("#dataset1").setFilter( wixData.filter() );

I hope this helps,

Yisrael

3

Hey Yisreal,

Thanks for the response - your answer makes sense to me, but how would i incorporate your code into mine? Specifically, is there a way to have the filter clear when someone selects the All Days option from the dropdown?

Thanks,

Noah

4

Something like this:

if (day == "All days")     // if we want all days
    newFilter = wixData.filter(); // then set to empty filter

Have fun,

Yisrael

5

Got it working, thanks for your help Yisreal!