Image in repeater to open in a lightbox

Ask the community
,
1

Hi there!
I used a code I found in the forum that opens an item image to a lightbox.
it works perfect! Im wondering if i can do it on a repeater.
When i put in the code it opens the images in a lightbox but all the same image.

these are the codes i used
this one is on the page with the repeater:

export function statusesImage_click(event) {
    wixWindow.openLightbox('statuses image lightbox', $w('#dataset1').getCurrentItem());
}

this one is in the lightbox:
I believe it has somthing to do with the onReady()) - I tried onItemReady()) but it did not work for me either

 import { lightbox } from 'wix-window';

 $w.onReady(() => {
 let item = lightbox.getContext();
    $w("#statusImage").src = item.statusImage;
    $w("#title").text = item.title;

 });

thanks in advance,
michal

2 
$w.onReady(() => {
$w("#repeater1").onItemReady(($i, iData) => {
    $i("#statusesImage").onClick(event => {
        wixWindow.openLightbox('statuses image lightbox',     iData.statusImage);
        })
    })
})
3

Hey! Is there a way to do this but opening the image in a placeholder in the same page instead of in a lightbox? Thanks!

4

Yes. You can put a box and use .expand() and .collapse()
You can also use a multistatebox and switch states.

5

Thanks! Didn´t know multistage boxes! Will definetly use that

6

Is this code is working? I am having issue with this code. I am trying to use in a repeater but with no success. Is there any connection issue? what is $i, iData in :blush: $w ( “#repeater1” ). onItemReady (( $i, iData ) => { :blush: part.

7

This is an old answer and today I’d write it differently:

//page
$w.onReady(() => {
$w('#repaterImage').onClick(event => {
const iData = $w('#repeater1').data.find(e => e._id === event.context.itemId);
wixWindow.openLightbox('LightBoxName', {status: iData,statusImage});
})
})

//lightbox
import wixWindow from 'wix-window';
const recievedItem = wixWindow.lightbox.getContext();
let status;
if(recievedItem?.status){
status = recievedItem.status;
}
8

Hi,
Sorry for late reply. I tested this code today. Its not working. I want to know what is the connection b/w lightbox image and this code? what should be the name of that (lightbox) image? Lastly : Have you tested this code?