Hi, sorry to post this again but needing urgent help to get this done. I am basically wanting to filter my repeaters by number of guests, rooms and bathrooms then display repeaters that match or are greater than. (ie 3 guests shows properties with space for 3 or more.
I have got my code but think there is some issues. I’m not sure how to define results (which is an error) and I don’t think my code for equal or more than the user selected dropdown value is correct.
Page is https://tailoredwebdesign.wixsite.com/book-the-best/queensland
Code:
import wixData from ‘wix-data’;
$w.onReady(function () {
let originalPropertiesInfo = ;
//Query to get the information from the database
wixData.query(“Queensland”)
.find()
.then((results) => {
originalPropertiesInfo = results.items;
$w(#repeater2
).data = originalPropertiesInfo;
})
.catch((err) => {
let errorMsg = err;
});
//Set the information to the repeater
$w(#repeater2
).onItemReady(($w, itemData) => {
//add here all the relevant elements of the repeater
//In this case, I’ve added a text and an image to the repeater
$w(#text52
).text = itemData.title;
$w(‘#image2’).src = itemData.images;
$w(#text53
).text = itemData.people;
$w(#text50
).text = itemData.bedrooms;
$w(#text51
).text = itemData.bathrooms;
$w(#text49
).text = itemData.description;
});
});
function filterResults(results){
const guests = $w(‘#Guests’).value;
const rooms = $w(‘#Rooms’).value;
const bathrooms = $w(‘#Bathrooms’).value;
if (guests && guests !== 'Choose number of guests') {
results = results.filter(item => item.people >= 3);
}
//after the first if statement, the results is filtered by state
if (rooms && rooms !== 'Choose number of beds') {
results = results.filter(item => item.bedrooms >= 3);
}
if (bathrooms && bathrooms !== 'Choose number of bathrooms') {
results = results.filter(item => item.bathrooms >= 3);
}
//results is filtered by both guests and rooms
return results;
}
let originalPropertiesInfo = ;
export function Guests_change(event, $w) {
//filtering the results
const filteredResults = filterResults(originalPropertiesInfo);
//setting the data
$w(`#repeater2`).data = filteredResults;
//setting the repeater elements
$w(`#repeater2`).onItemReady(($w, itemData) => {
console.log(itemData.title);
$w(`#text52`).text = itemData.title;
$w('#image2').src = itemData.images;
$w(`#text53`).text = itemData.people;
$w(`#text50`).text = itemData.bedrooms;
$w(`#text51`).text = itemData.bathrooms;
$w(`#text49`).text = itemData.description;
});
}
export function Rooms_change(event, $w) {
//filtering the results
const filteredResults = filterResults(originalPropertiesInfo);
//setting the data
$w(`#repeater2`).data = filteredResults;
//setting the repeater elements
$w(`#repeater2`).onItemReady(($w, itemData) => {
console.log(itemData.title);
$w(`#text52`).text = itemData.title;
$w('#image2').src = itemData.images;
$w(`#text53`).text = itemData.people;
$w(`#text50`).text = itemData.bedrooms;
$w(`#text51`).text = itemData.bathrooms;
$w(`#text49`).text = itemData.description;
});
}
export function Bathrooms_change(event, $w) {
//filtering the results
const filteredResults = filterResults(originalPropertiesInfo);
//setting the data
$w(`#repeater2`).data = filteredResults;
//setting the repeater elements
$w(`#repeater2`).onItemReady(($w, itemData) => {
console.log(itemData.title);
$w(`#text52`).text = itemData.title;
$w('#image2').src = itemData.images;
$w(`#text53`).text = itemData.people;
$w(`#text50`).text = itemData.bedrooms;
$w(`#text51`).text = itemData.bathrooms;
$w(`#text49`).text = itemData.description;
});
}
export function refine_onClick(event, $w) {
filterResults(results);
}
THANKYOU!!