Help filtering booleon values

Ask the community
, ,
1

I am trying to make a page that displays numerous projects and can be filtered by a dropdown menu. I followed a tutorial but I get an error Missing semicolon. Can someone smart please tell me what I am doing wrong?

Here is my code:

import wixData from 'wix-data';

$w.onReady (function () {

}) ;

export function storeDropdown_change(event) {
let filterStore = $w("#storeDropdown").value;

$w("#dataset1").onReady( () => {

If (filterStore === "Art") {
$w("#dataset1").setFilter(wixData.filter().eq("art", true));
} 

If (filterStore === "Community") {
$w("#dataset1").setFilter(wixData.filter().eq("community", true));
} 

If (filterStore === "Retail") {
$w("#dataset1").setFilter(wixData.filter().eq("retail", true));
} 

If (filterStore === "Education") {
$w("#dataset1").setFilter(wixData.filter().eq("education", true));
} 
} 
)}
2

I kept looking at it and I could not spot the problem. Then aha!! You capitilized your IFs. They must be in lowercase.

import wixData from 'wix-data';

$w.onReady (function () {
})


export function storeDropdown_change(event) {
    let filterStore = $w("#storeDropdown").value;
    
    
    $w("#dataset1").onReady( () => {
        if (filterStore === "Art") {
            $w("#dataset1").setFilter(wixData.filter().eq("art", true));
        } 

        if (filterStore === "Community") {
            $w("#dataset1").setFilter(wixData.filter().eq("community", true));
        } 

        if (filterStore === "Retail") {
            $w("#dataset1").setFilter(wixData.filter().eq("retail", true));
        } 

        if (filterStore === "Education") {
            $w("#dataset1").setFilter(wixData.filter().eq("education", true));
        } 
    })
}
3

Of course! What a fool I was! Thank you so much!
I no longer get an error message now which is great - only problem is my dropdown menu doesn’t filter my repeater when I preview the site. Any ideas what I am still doing wrong? I have checked all the values/labels/id’s and everything seems to be correct and connected…

4

I relooked at your code and was now actually following the logic.

Here’s a few things I spotted.

  1. In your export function storeDropdown_change ( event ) { you have:
$w("#dataset1").onReady( () => {

Remove the .onReady() line and its matching closing ‘}’. The user had made the selection from the dropdown, and by that time your data would have already loaded on the page. You’re going to change the record pointer on your dataset using the filter, so there is no use to use the onReady().

  1. Can you ensure that your 4 variables you are checking (‘Art’, ‘Community’, ‘Retail’, ‘Education’) are boolean in the table (collection). Since you are using .eq() to set your filter, the field type has to match exactly.

  2. Since using the setFilter() returns a promise (meaning it promises to set the filter at some point), You can wait for the setFilter() to complete before continuing. I use await to let it finish setting the filter before I continue. Alternatively, people also use .then() and do something after the filter has been set. If you use await or .then() you will have to change your main function line to:

export async function storeDropdown_change(event) {

Then you can use:

await w("#dataset1").setFilter(wixData.filter().eq("retail", true));

In one of the examples near the bottom of the API documentation, they show the example of using .setFilter() with a .then() clause.

Here’s the link to the API docs: