Multiple Selection Tags Filter using Velo by WIX🎉

Show and tell
,
2

Did you use Repeater instead of Galery?
I trying to make this work but with a gallery ( on dynamic pages ).
I want to have a lot of filters, let’s say at least 5 to start.
Let’s say gallery ( database ) got has a lot of pictures of rooms(places ), so I need multiply filters that can be all used at the same time it is needed to find the exact specific image the user is looking for.
Any advice?

import wixData from ‘wix-data’;
​
$w.onReady(function () {

$w("#roomcategory, #capacity, #roomrating, #colortag, #languagetag").onChange(function () { 
    search(); 
} 

function search() { 

    let filter = wixData.filter(); 

    let roomcategoryIdx = $w("#roomcategory").selectedIndices; 
    let capacityIdx = $w("#capacity").selectedIndices; 
    let roomratingIdx = $w("#roomrating").selectedIndices; 
	let colortagIdx = $w("#colortag").selectedIndices; 
    let languagetagIdx = $w("#languagetag").selectedIndices; 
    
	let roomcategoryVal = $w("#roomcategory").value; 
    let capacityVal = $w("#capacity").value; 
    let roomratingVal = $w("#roomrating").value; 
	let colortagVal = $w("#colortag").value; 
	let languagetagVal = $w("#languagetag").value; 
	
    if (roomcategoryIdx.length > 0 || capacityIdx.length > 0 || roomratingIdx.length > 0) || colortagIdx.length > 0) || languagetagIdx.length > 0) { 

        filter = filter.hasAll("roomcategory", roomcategorysVal) 
            .and(filter = filter.hasAll("capacity", capacityVal)) 
            .and(filter = filter.hasAll("roomrating", roomratingVal)) 
			.and(filter = filter.hasAll("colortag", colortagVal)) 
			.and(filter = filter.hasAll("languagetag", languagetagVal)) 
        $w("#portfolioDataset").setFilter(filter) 
            .then(count) 

    } else { 
        $w("#portfolioDataset").setFilter(filter) 
            .then(count) 
    } 

    $w("#resetfilters").onClick(function () { 
        $w("#roomcategory, #capacity, #roomrating, #colortag, #languagetag").value = undefined; 
        $w("#portfolioDataset").setFilter(wixData.filter()).then(count); 
    }); 

} 

//COUNT ITEM 
function count() { 
    let count = $w("#portfolioDataset").getTotalCount(); 
    if (count > 0) { 
        $w("#countText").text = `${count} rooms found`; 
    } else { $w("#countText").text = `No rooms found`; } 

    return count; 
} 

$w("#portfolioDataset").onReady(function () { 
    count(); 
});

});

1158×664 42.1 KB