Trying to make cool Filter

Ask the community
, ,
3

Thanks Tal.

Video that you’ve gave, really helped.

But in drop-down it takes all the options that are written in database items. For example, I want in drop-down as options only male and female, but it gives as much male and female options as much they are in gender column in database.

Also it gives this error:

1016×232 4.13 KB

Here is my code:

import wixData from “wix-data”;

$w.onReady(() => {
loadUsers();
});

let lastFilterTitle;
let lastFilterUsers;
let debounceTimer;
export function iTitle_keyPress($w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#iTitle’).value, lastFilterUsers);
}, 500);
}

export function genderDropDown_change($w) {
filter(lastFilterTitle, $w(‘#genderDropDown’).value);
}

function filter(title, users) {
if (lastFilterTitle !== title || lastFilterUsers !== users) {
let newFilter = wixData.filter();
if (title)
newFilter = newFilter.contains(‘title’, title);
if (users)
newFilter = newFilter.contains(‘gender’, users);
$w(‘#dataset1’).setFilter(newFilter);
lastFilterTitle = title;
lastFilterUsers = users;
}
}

function loadUsers() {
wixData.query(‘Users’)
.find()
.then(res => {
let options = [{
“value”: ‘’,
“label”: ‘All’
}];
options.push(…res.items.map(users => {
return {
“value”: users.gender,
“label”: users.gender
};
}));
$w(‘#genderDropDown’).options = options;
});

}

So, generally it does what I want, but would be good to solve that little issues.

Thank you,
Nodar.