"No Results" Message

Discussion Ask a question
, ,
1

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??

2

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.

1 Like
3

Thanks, but I get an error for NewFilter as undefined.

4

@info81405 I don’t know why newFilter is not defined since I see it in the filter() function that you posted. You will need to make sure that you add my code in the correct place in your code. You will need to use my code to replace this line of your code:

$w('#members').setFilter(newFilter);
5

Definitely was placement, works now!! Thank you

1 Like
6

@yisrael-wix this code has helped me a lot, but for the life of me, I don’t understand why I’m getting an error for the “.”

7

@eben-meyers Remove the semi-colon from the end of the first line of your code.

8

@yisrael-wix I feel really silly asking this question now, but there are errors still coming up. replacing the code with yours, by keeping it the same, and by adding in a new let = newFilter; All three don’t work. :frowning: I just can’t figure out why and where this error is happing.

9

@eben-meyers You declared newFilter, but you haven’t defined it. See the setFilter() API and the WixDataFilter API for details on creating and defining a filter.

1 Like
10

@yisrael-wix You are a magical person! :slight_smile: After figuring out that the placement is key, as you said above, I found that I already had defined “newFilter” and it just needed to be placed in the correct place.

Thank You! Your amazing!

1 Like
11

oh, thanks it helps me too, really replace is helps.

1 Like