Hiding An Element from Dataset in a repeater when field is empty

Ask the community
, , , ,
1

Question:
How can I hide the image in a repeater when the dataset field is empty? Currently, when the “Samenwerking Logo” field in my dataset is empty, a white placeholder or blank image is still displayed. I want the image to be completely hidden if no logo is available for that item.

Product:
Wix Editor (Velo Code)

What are you trying to achieve:
I’m trying to display an image in a repeater only if the dataset field (for a logo) contains a valid image URL. If the dataset field is empty or doesn’t have a logo, the image should be hidden entirely, without showing any placeholders or white space.

What have you already tried:

  • I’ve set up the repeater and connected the image field to the dataset (“Samenwerking Logo”).
  • I’ve used Velo code to attempt to show/hide the image based on the field’s data.
  • I tried resetting the image src to null and using .hide() to remove the image, but I still get white placeholders or an empty image appearing.
  • I’ve reviewed Wix forums and articles related to repeaters and dynamic images, but haven’t found a solution that works.

Additional information:

  • My repeater ID is #repeater1, the dataset ID is #dataset1, and the image ID is #image164.
  • I am using the following code to hide the image, but it still shows a white placeholder when the logo is missing:
$w.onReady(function () {
    $w("#dataset1").onReady(function () {
        $w("#repeater1").onItemReady(($item, itemData) => {
            if (itemData.samenwerkingLogo) {
                $item("#image164").src = itemData.samenwerkingLogo;
                $item("#image164").show();
            } else {
                $item("#image164").src = null;
                $item("#image164").hide();
            }
        });
    });
});

I’ve also checked that no default placeholder images are set for the image element. What should I adjust to ensure no white placeholder appears when the field is empty?

3

The white space you’re experiencing is because you’re using the show/hide functions, rather than expand/collapse

Try doing

$item('#image164').collapse()

Also, I wouldn’t wait for dataset.onReady to set the repeater.onItemReady.
And you should probably assign better tags than #image164

4

Thank you for your help!
Unfortunately this didn’t work and I still get a white placeholder :frowning: