How to conditionally remove/suppress lines from imaged source?

NOTE: This thread was created because I had been in contact with Teodor about an issue with Lightbox. Links are not really valid anymore. This morphed to how to get an array of image paths into swiper/lightbox. I wouldn’t spend any time reading this thread.
I’ll repost a HowTo on that subject specifically.

Live link:
(note: this won’t work on a narrow mobile screen - media tag is set for tablet or higher)

If you click on the 3rd line, that vehicle record has 5 images.
5 physical image fields exist in that record (Image1, Image2, etc)
Click on the corvette under it and only 3 images. All fine so far.

BUT, I have a lightbox for the images.
So if you clicked on an image, they’ll nicely be displayed enlarged for browsing. Thank you Wappler!

Problem is the Corvette will show Image 4 & 5 from the Econoline Van. (assuming you clicked in this order. more specifically, when any vehicle doesn’t have 5 images, whichever ones are not supplied will show data from the most-recent viewed vehicle that had an image in that spot.)
Corvette doesn’t have Image4 & 5 data… its null.
So Lightbox, stored in the DOM or somesuch, has data from the prior record. And the null data isn’t overwriting that prior data, so it shows incorrectly.

What I think I need to do is Conditionally wrap each Image field to only exist in the source IF there was a Path in the data, and its not null. (Lines 162-166 in Source)

@Teodor said in a prior thread that Lightbox reads the data between the <a> </a> tags. I figure if for this given data-detail vehicle, if I show only the exact # of Images then I’ll be good.

What 'yall think?

PS _ this all worked fine before I integrated Lightbox. Having all 5 image fields displayed just fine.

Community Page
Last updated: