Hi everyone
I have a repeater on my page with a picture on it. I have a query that returns images with the same ID code as the repeater. I have a next/back button on the repeater and I want it to show the next/back images returned from the query.
The code (kinda) works. However, after clicking either the back or forth button for the total amount of images returned from the query (e.g. 4 images returned, 4 clicks later) it starts returning " TypeError: Cannot read property ‘images’ of undefined " . and then won’t allow me to click any more.
It’s also a bit buggy when you start to jump between the back and forth button.
The repeater/image setup looks like this:
Here’s my code so far:
$w.onReady(function () {
$w("#repeater3").onItemReady( ($w, itemData, index) => {
let refID = $w("#text151").text; // the text used for the ID ref
let i =0
wixData.query("images")
.eq("title", result)
.find()
.then((results)=> {
let resultLength = results.length;
let item = results.items[i];
let image = item.images;
$w("#image16").src = image;
$w("#button71").onClick(() => { // move forward button
if (i >= item.length) {
i = 0;
} else {
let next = results.items[i+1];
let pic = next.images;
$w("#image16").src = pic;
i++;
}
$w("#button72").onClick(() => { // move back button
if (i >= item.length) {
i = 0;
} else {
let next = results.items[i+1];
let pic = next.images;
$w("#image16").src = pic;
i--;
}
})
.catch( (err) => {
let errorMsg = err;
});
...
...
Many thanks for any help anyone can give
Thomas