Hello - Can someone help me troubleshoot this code?
I am trying the exact same function posted at https://www.wix.com/corvid/example/search but my version of code is not working. I can tell it’s close though because there are no errors, and my variables-edited version of the code is breaking my dropdown menu selections.
The drop down for example, when my code is applied, is pulling the ‘city’ id from the dbase (input) City names as the dropdown options, instead of the list of States I assigned as the selections.
But more so, even by selecting the incorrectly overridden info in the dropdown, nothing happens upon selection. Nothing happens when I enter the search que either. But it’s so close! Can someone help me through whatever dot, or capitalization I am missing somewhere? ; )
And I’m confused because nowhere in the WIX code does it indicate the results to take place in the repeater on the page. Is the repeater output indication not needed?
The successful code that WIX uses in their sample, for title entry and continent, is as follows:
import wixData from “wix-data”;
$w.onReady(() => {
loadContinents();
});
let lastFilterTitle;
let lastFilterContinent;
let debounceTimer;
export function iTitle_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#iTitle’).value, lastFilterContinent);
}, 500);
}
export function iContinent_change(event, $w) {
filter(lastFilterTitle, $w(‘#iContinent’).value);
}
function filter(title, continent) {
if (lastFilterTitle !== title || lastFilterContinent !== continent) {
let newFilter = wixData.filter();
if (title)
newFilter = newFilter.contains(‘articleTitle’, title);
if (continent)
newFilter = newFilter.contains(‘continent’, continent);
$w(‘#dataset1’).setFilter(newFilter);
lastFilterTitle = title;
lastFilterContinent = continent;
}
}
function loadContinents() {
wixData.query(‘Continents’)
.find()
.then(res => {
let options = [{“value”: ‘’, “label”: ‘All Continents’}];
options.push(…res.items.map(continent => {
return {“value”: continent.title, “label”: continent.title};
}));
$w(‘#iContinent’).options = options;
});
}
The unsuccessful code I am trying to use in mine, for city and state, is as follows:
import wixData from “wix-data”;
$w.onReady(() => {
loadModelSubmissions();
});
let lastFilterCity;
let lastFilterState;
let debounceTimer;
export function iCity_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#iCity’).value, lastFilterState);
}, 500);
}
export function iState_change(event, $w) {
filter(lastFilterCity, $w(‘#iState’).value);
}
function filter(city, state) {
if (lastFilterCity !== city || lastFilterState !== state) {
let newFilter = wixData.filter();
if (city)
newFilter = newFilter.contains(‘city’, city);
if (state)
newFilter = newFilter.contains(‘state’, state);
$w(‘#dataset1’).setFilter(newFilter);
lastFilterCity = city;
lastFilterState = state;
}
}
function loadModelSubmissions() {
wixData.query(‘ModelSubmissions’)
.find()
.then(res => {
let options = [{“value”: ‘’, “label”: ‘All States’}];
options.push(…res.items.map(state => {
return {“value”: state.city, “label”: state.city};
}));
$w(‘#iState’).options = options;
});
}
Can someone please help me find my way to success with this code? Please and thank you! : )