Hi everyone,
I’ve spent a long time figuring out how to create the search bar and drop down filters for my dynamic dataset after watching one of the Wix videos. I finally got it all working, however, what the video didn’t seem to address was an issue with the search functionality.
The searching works fine in narrowing down the results to display, however, when I start deleting the search (letter by letter), the search doesn’t display the results applicable to the remaining letters. Additionally, no results ever come back once all letters have been deleted from the search bar.
Does anyone have any ideas on how to fix this?
Here’s my code for that dynamic page.
import wixData from “wix-data”;
$w.onReady(() => {
loadStates()();
});
let lastFilterPlate;
let lastFilterState;
let debounceTimer;
export function iPlate_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#iPlate’).value, lastFilterPlate);
}, 500);
}
export function iState_change(event, $w) {
filter(lastFilterPlate, $w(‘#iState’).value);
}
function filter(Plate, State) {
if (lastFilterPlate !== Plate || lastFilterState !== State) {
let newFilter = wixData.filter();
if (Plate)
newFilter = newFilter.contains(‘licencePlateNumber’, Plate);
if (State)
newFilter = newFilter.contains(‘state’, State);
$w(‘#dynamicDataset’).setFilter(newFilter);
lastFilterPlate = Plate;
lastFilterState = State;
}
}
function loadStates() {
wixData.query(‘States’)
.find()
.then(res => {
let options = [{“value”: ‘’, “label”: ‘All States’}];
options.push(…res.items.map(title => {
return {“value”: title.stateAbbreviation, “label”: title.stateAbbreviation};
}));
$w(‘#iState’).options = options;
});
}
Thanks in advance!
Jason