My webpage is not loaded properly, data from query is not inserted to repeater.
I think this has something to do with promise but I'm not sure,
can anyone help?
https://www.garimd.com/for-rent
import wixWindow from 'wix-window';
import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady(() => {
// show only approved data
//$w('#dataset1').setFilter(wixData.filter().eq('isApproved', true));
wixData.query('RentRealEstate')
.eq('isApproved', true) // show only approved data
.find()
.then((results) => {
$w('#repeater1').data = results.items;
console.log('here1');
})
// show all cities in dropdown: city
wixData.query('RentRealEstate')
.ascending('city')
.eq('isApproved', true)
.find()
.then(res => {
let options = [{ 'value': '', 'label': 'כל הארץ' }];
const uniqueCities = getUniqueCities(res.items);
$w('#dropdownRentCity').options = options.concat((buildOptions(uniqueCities)));
console.log('here2');
})
// show all types in dropdown: property-type
wixData.query('PropertyTypes')
.find()
.then(res => {
let options = [{'value': '', 'label': 'כל סוג'}];
const uniqueType = getUniqueType(res.items);
$w('#dropdownPropertyType').options = options.concat(buildOptions(uniqueType));
})
$w('#dataset1').onReady(() => {
$w('#repeater1').onItemReady(($item, itemData, index) => {
// open dynamic lightbox on click
$item('#buttonOpenLightbox').onClick(() => {
wixWindow.openLightbox('LightboxRentRealEstate', itemData);
})
// create a google maps link for each item
let mapsURL = 'https://www.google.co.il/maps/place/' +
itemData.address.replace(' ', '+') +
',+' + itemData.city.replace(' ', '+');
//console.log(mapsURL);
$item('#buttonAddress').link = mapsURL;
$item('#buttonAddress').target = '_blank';
console.log('here3');
})
});
//
// I deleted some necessary code here
//
function getUniqueCities(items) {
const citiesOnly = items.map(item => item.city);
// Return an array with a list of unique cities
return [...new Set(citiesOnly)];
}
function getUniqueType(items) {
const uniqueType = items.map(item => item.title);
// Return an array with a list of unique cities
return [...new Set(uniqueType)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { value: curr, label: curr };
});
}
Try to organize your code first.
Use only a single $w.onReady() per page (it's a good practice).
Decide if you want to use direct collection queries or datasets and stick to it.
Then if it still doesn't work, post your code again.