Hello-
Trying to add code that displays text box that says "No Results" when my filter has no results.
Here is current code that consists of 2 drops downs & a search bar. Also have buttons for each cuisine for user to click and auto search my database.
COMPLETE CODE
import {local} from 'wix-storage';
import wixData from 'wix-data';
import wixWindow from 'wix-window';
$w.onReady (function () {
var sameWord = local.getItem("searchWord");
$w("#searchbar1").value = sameWord;
$w('#members').onReady(function () {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
});
$w.onReady(() => {
loadLocations();
});
$w.onReady(() => {
loadPrice();
});
$w.onReady (() => {
local.clear("#searchbar1");
});
let lastFilterSearchbar;
let lastFilterLocation;
let lastFilterPrice;
let debounceTimer;
export function logo_click(event, $w){
$w("#searchbar1").show()
$w("#searchbar1").value = "Let us suggest...";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
find($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
function find(searchbar,location, logo,price) {
if (lastFilterSearchbar !== searchbar || lastFilterLocation !== location || lastFilterPrice !== price) {
let newFilter = wixData.filter();
if (searchbar)
newFilter = newFilter.contains('suggest', searchbar)
$w('#members').setFilter(newFilter);
lastFilterSearchbar = searchbar;
lastFilterLocation = location;
lastFilterLocation = price;
}
}
export function pizza_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Pizza";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function ramen_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Ramen";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function italian_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Italian";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function seafood_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Seafood";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function brunch_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Brunch";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function breakfast_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Breakfast";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function sushi_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Sushi";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function american_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "American";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function vegeterian_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Vegeterian";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function mexican_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Mexican";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function pizzaimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Pizza";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function ramenimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Ramen";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function italianimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Italian";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function seafoodimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Seafood";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function brunchimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Brunch";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function breakfastimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Breakfast";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function sushiimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Sushi";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function americanimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "American";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function vegeterianimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Vegeterian";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function mexicanimg_click(event) {
$w("#searchbar1").show()
$w("#searchbar1").value = "Mexican";
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function searchbar1_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function searchbar1_change() {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#searchbar1').value, lastFilterLocation, lastFilterPrice);
}, 500);
}
export function location_change(event, $w) {
filter(lastFilterSearchbar, $w('#location').value);
}
export function price_change(event, $w) {
filter(lastFilterSearchbar, lastFilterLocation, $w('#price').value);
}
function filter(searchbar,location,price) {
if (lastFilterSearchbar !== searchbar || lastFilterLocation !== location || lastFilterPrice !== price) {
let newFilter = wixData.filter();
if (searchbar)
newFilter = newFilter.contains('title', searchbar)
.or = newFilter.contains('cuisines' ||'features'||'categories'||'catergory1'||'category2',searchbar)
if (location)
newFilter = newFilter.contains('location', location);
if (price)
newFilter = newFilter.contains('price', price);
$w('#members').setFilter(newFilter);
lastFilterSearchbar = searchbar;
lastFilterLocation = location;
lastFilterPrice = price;
}
}
function loadLocations() {
wixData.query('members')
.find()
.then(res => {
let options = [{ "value": '', "label": 'All Locations' }];
options.push(...res.items.map(location => {
return { "value": location.searchbar, "label": location.price.searchbar};
}));
$w('#location').options = options;
});
}
function loadPrice() {
wixData.query('members')
.find()
.then(res => {
let options = [{ "value": '', "label": 'All Prices' }];
options.push(...res.items.map(price => {
return { "value": price.searchbar, "label": price.location.searchbar};
}));
$w('#price').options = options;
});
}
//ADDED THIS CODE FOR NO RESULTS BOX TO SHOW BUT DOESN"T WORK//
wixData.query('members').find()
.then( (results) => {
if (results.length > 0) {
$w('#nores').show();
}
else {
$w('#nores').hide();
}
} )
.catch( (err) => {
let errorMsg = err; } );
let slideInOptions = { "duration": 200, }; let slideOutOptions = { "duration": 500, }; export function filters_click(event,$w) { $w("#filterbox").show("slideIn") } export function filterbutton_click(event) { $w("#filterbox").show("slideIn") } export function Close_click(event) { $w("#filterbox").hide("slideOut") } Can you tell me what code would work since I have setFilter??
oh, thanks it helps me too, really replace is helps.
Definitely was placement, works now!! Thank you
The code you "added for no results" won't work since it isn't checking the results of the dataset filter, and I'm not even sure it's being called. You will need something like this (not tested) where you set the filter in your code:
$w('#members').setFilter(newFilter) .then(() => { console.log("Dataset is now filtered"); if ($w('#members').getTotalCount() === 0) { $w('#nores').show(); } else { $w('#nores').hide(); } }) .catch((err) => { console.log(err); });
Good luck.