Filtering Multiple Dataset Options in Repeater

Ask the community
,
1

Hi there!
Novice here to the whole coding world.
I’m trying to set up a page on our website that will show the properties we have for sale/lease in the repeaters area, and have a Refine Search bar at the top that lets visitors filter out different criteria.
So far I’ve only been able to get it to filter for the first dropdown.
Below is what I have so far:

1600×868 116 KB

I’ve searched the forum and found a couple discussions, but I’m not understanding what needs to be done.
Any help out there??
Thanks!

2

Here is the code I’m trying to make work.
Can anyone find why it isn’t?

// For full API documentation, including code examples, visit Velo API Reference - Wix.com
import wixData from ‘wix-data’;

let properties = ;
let filteredResults = ;

$w.onReady( function () {
wixData.query(“dataset1”)
.find()
.then((results) => {
properties = results.items;
$w(#repeater1).data = properties;
})
. catch ((error) => {
let errorMsg = error.message;
let code = error.code;
});
$w(“#repeater1”).onItemReady(($w, itemData) => {
$w(“#text39”).text = itemData.type;
$w(“#text41”).text = itemData.county;
$w(“#text38”).text = itemData.usage;
$w(“#text34”).text = itemData.broker;
});
});

function filterResults() {
filteredResults = ;
const type = $w(‘#dropdown1’).value;
const county = $w(‘#dropdown2’).value;
const usage = $w(‘#dropdown3’).value;
const broker = $w(‘#dropdown4’).value;
filteredResults = properties.slice();
if (type && type !== ‘Choose a Type’) {
filteredResults = filteredResults.filter(item => item.type >= type);
}
if (county && county !== ‘Search by County’) {
filteredResults = filteredResults.filter(item => item.county >= county);
}
if (usage && usage !== ‘Search by Usage’) {
filteredResults = filteredResults.filter(item => item.usage >= usage);
}
if (broker && broker !== ‘Search by Broker’) {
filteredResults = filteredResults.filter(item => item.broker >= broker);
}
if (filteredResults.length === 0) {
$w(‘#repeater1’).show();
}
else $w(‘#repeater1’).hide();
if (filteredResults.items.length > 0) {
$w(‘#repeater1’).show();
}
else $w(‘#repeater1’).hide();
}

export function type_change() {
$w(‘#repeater1’).data = filteredResults;
$w(“#repeater1”).onItemReady(($w, itemData) => {
$w(“#text39”).text = itemData.type;
$w(“#text41”).text = itemData.county;
$w(“#text38”).text = itemData.usage;
$w(“#text34”).text = itemData.broker;
});
}

export function county_change() {
$w(‘#repeater1’).data = filteredResults;
$w(“#repeater1”).onItemReady(($w, itemData) => {
$w(“#text39”).text = itemData.type;
$w(“#text41”).text = itemData.county;
$w(“#text38”).text = itemData.usage;
$w(“#text34”).text = itemData.broker;
});
}

export function usage_change() {
$w(‘#repeater1’).data = filteredResults;
$w(“#repeater1”).onItemReady(($w, itemData) => {
$w(“#text39”).text = itemData.type;
$w(“#text41”).text = itemData.county;
$w(“#text38”).text = itemData.usage;
$w(“#text34”).text = itemData.broker;
});
}

export function broker_change() {
$w(‘#repeater1’).data = filteredResults;
$w(“#repeater1”).onItemReady(($w, itemData) => {
$w(“#text39”).text = itemData.type;
$w(“#text41”).text = itemData.county;
$w(“#text38”).text = itemData.usage;
$w(“#text34”).text = itemData.broker;
});
}

export function submit_click() {
const selectedIndexLocation = $w(‘#dropdown1’).selectedIndex;
const selectedLocationByLabel = $w(‘#dropdown1’).options[selectedIndexLocation].label
wixData.query(“properties”)
.eq(“type”, selectedLocationByLabel)
.contains(“county”, $w(“#dropdown2”).value)
.find()
.then((results) => {
$w(‘#repeater1’).data = results.items;
if (results.items.length === 0) {
$w(‘#repeater1’).show();
} else $w(‘#repeater1’).hide();
if (results.items.length > 0) {
$w(‘#repeater1’).show();
} else $w(‘#repeater1’).hide();
});
$w(“#repeater1”).onItemReady(($w, itemData) => {
$w(“#text39”).text = itemData.type;
$w(“#text41”).text = itemData.county;
$w(“#text38”).text = itemData.usage;
$w(“#text34”).text = itemData.broker;
});
}