Filter my data set with Dropdowns AND selection tags

Ask the community
,
1

I want to apply several filters to my dataset, so that the visitor to my website can find their ideal cell phone. This is achieved thanks to various selections made by the user, either in dropdowns or in selection tags. The problem is that they filter independently; when they select the brand of the phone in the Selections tags, several results appear based on that brand, but when I want to continue filtering to find phones that are cheap (based on the choices made in a Dropdown), cheap phones appear, but of any brand. What I’m looking for is that the visitor selects a brand of cell phones and sees the cheap options of that specific brand. Any query, more than welcome, I am not the most skillful with words. Thank you!

1 Like
2

Hello Benjamin,

for your project you will need something like this one…

import wixData from 'wix-data';

export function mySelectionTags_change(event) {

    let selectedTags = $w("#mySelectionTags").value;
    // Define an empty filter
    let filter = wixData.filter();

    if (selectedTags) {
        // Build a filter that only includes items with all selected tags
        filter = filter.hasAll("tags", selectedTags);
    }

    $w('#myDataset').setFilter(filter);
}

…if you are working with “Selection-Tags”

3

A little bit more of info for your problem, you will find here in a post with similar issue…

https://www.wix.com/corvid/forum/community-discussion/showing-input-fields-based-on-previous-input

4

And here an expanded CODE with a little bit more of functionality…

import wixData from 'wix-data';

export function STAG1_change(event) {
 let selectedTags = $w("#STAG1").value;
    console.log(selectedTags)
 let filter = wixData.filter();
 if (selectedTags) {
        filter = filter.hasSome("tags", selectedTags);
        console.log(selectedTags.length)
    }
    $w('#dataset1').setFilter(filter);
}

function start_FilterProzess (VALUE) {

 // FIRST-PROCESS to FIND ----> "Best-Price"
 if (VALUE === "Best Price"){console.log("Best-Price Search-Process activated !")
        $w("#dataset1").onReady( () => {
            $w("#dataset1").getItems(0, $w("#dataset1").getTotalCount())
            .then( (result) => {
 let items = result.items;
 let totalCount = result.totalCount;
                console.log (items)
                console.log(totalCount)

 let bestPrice = 1000
 for (var i = 0; i < totalCount; i++) {
 if (items[i].price < bestPrice) {bestPrice=items[i].price}
                }
                console.log("bestPrice = " + bestPrice)
                $w('#GRPbestprice').show("FadeIn")
                $w('#TXTprice').text = bestPrice.toString()
            } )
            .catch( (err) => {
 let errMsg = err.message;
 let errCode = err.code;
            } );
        } );
    }

 // SECOND-PROCESS to FIND ----> "Newest-Model"

 if (VALUE === "Newest Model"){console.log("Newest-Model Search-Process activated !")}
}



export function dropdown1_change(event) {$w('#BTNfind').label = "Find" + $w('#dropdown1').value}
export function BTNfind_click(event) {start_FilterProzess($w('#dropdown1').value)}

The result of this CODE you can see in this example…

https://russian-dima.wixsite.com/meinewebsite/filter-my-phones