Reverse Filter - Multiple Filters/Overlapping Filters

Ask the community
,
1

Hi All,

What is the best way to “reverse” a filter I’ve made, yet keep other filters on. For example, let’s say I have two filters on my dataset “Keyword Search” and “Status”. The data correctly filters if I click each individually AND it also correctly filters the data if I have both filters on.

However, if I have both filters on, then turn one off how can I get the data to add back in that data which originally was filtered out, yet still keep the first filter on?

Here is the code I have so far.

 
$w("#keywordSearch").onKeyPress( (event, $w) => {
 if (event.code === 13) {
    $w("#dataBox").collapse();
    $w("#placeholderBox").expand();
    console.log(repeaterData[0]);
 const valueToFilter = $w('#keywordSearch').value;
    tempItems = currentMapItems.filter(item => 
       item.conjoined_address.toLowerCase().includes(valueToFilter.toLowerCase()) || item.county.toLowerCase().includes(valueToFilter.toLowerCase())
       );   
 
       checkFilter(tempItems);
}
});

$w("#StatusButton").onChange( () => {
 
const valueToFilter = $w('#StatusButton').value;
    tempItems = currentMapItems.filter(item => 
       item.foreclosure_status.includes(valueToFilter)
       );
       checkFilter(tempItems);

});
2

Hey mate so far this method is working for me great
Nayeli is gonna create a video on this soon

I have do it for 10 - 15 filter work all the user input element

3

Thanks Salman, this does work well. However, it requires I use the wix-datasets since the filter is a wix api. It’s a solid alternative, but ideally I can do this without using datasets.

4

@salman2301 I am trying to build something similar. Could you share the code you used for that?

5

@alesonrietow Code is on the same page :slight_smile:

6

@salman-hammed Thanks. This is working great except I have one dropdown that I want to connect to a few fields that are booleans.

Any thoughts or help on how to fit this code (or rather the result of ):

let filterPrice = $w("#priceRange").value;
 if (filterPrice === "500") {
                                         $w("#dataset1").setFilter(wixData.filter().eq("upTo500", true));
                                }
 if (filterPrice === "1000") {
                                         $w("#dataset1").setFilter(wixData.filter().eq("to1000", true));
                                }
 if (filterPrice === "1001") {
                                          $w("#dataset1").setFilter(wixData.filter().eq("over1000", true));
                                }

On to this line of your code (so my multiple filters work together) where color would be filterPrice:

if (color && color !== 'all') {	
	filter = filter.eq("color", color);	
}

Any guidance would be GREATLY appreciated. I’ve been at this for weeks with no result. The struggle is that I don’t want to use a greater than or less than, but rather search a specific price range. I have the value in a number column as well, the boolean was a hack to try and accomplish searching a specific range.