Hide list element when database field is empty

Ask the community
,
1

Hi there. I’d like to have a list element with the the following informations:
picture | name | position | text
The content comes from a database in whicht the fields name and position are alway filled but not the picutre and text fields.
If picture and/or text fields are empty I would like to hide the space provided in the list.
Any ideas?
At least I would like to have a list like on this page: https://www.matthias-anderegg.ch/komitee
Thanks for help!

2

Sure !!
You can use this method …

#repeater1 - repeater
#container1 - container in repeater.
field1 - field of the image in the database

$w('#repeater1').onItemReady( ($item, itemData, index) => {
  if(itemData.field1 === "")
     $w('#container1').collapse();
     }
      else {
          $w('#container1').expand();
           }
  
});
3

Thanks a lot.
Sounds good, but somehow it doesn’t work.
That’s how i used it:

$w( ‘#teamRepeater’ ).onItemReady( ($item, itemData, index) => {
if (itemData.teamImage === “” )
{$w( ‘#container1’ ).collapse();}

else {
$w( ‘#container1’ ).expand();
}

});
Can you see a mistake?

4

@patrizia Sure, there is a mistake…

Change this → 

$w('#container1').collapse();

into → 

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

$w('#teamRepeater').onItemReady(($item, itemData, index) => {
 if (itemData.teamImage === "") { 
$item('#container1').collapse();
}
else {    
 $item('#container1').expand();         
  }
  });
5

@ajithkrr thank you so much.
unfortunately it doesn’t work.

$w( ‘#teamRepeater’ ).onItemReady( ($item, itemData, index) => {
if (itemData.photo === “” ) {
$item( ‘#container1’ ).collapse();
}
else {
$item( ‘#container1’ ).expand();
}
});

6

I found the issue here →

The code would be more like this →

#dataset1 - dataset
#teamRepeater - repeater
photo - field of photo in database
#container1 - container in the repeater

$w.onReady(function () {
    $w('#dataset1').onReady(() => {

    $w('#teamRepeater').forEachItem(($item, itemData, index) => {
 if (!itemData.photo) {
            $item('#container1').collapse();
        } else {
            $item('#container1').expand();
        }
    });
    });
});
7

great! that works!
thank you so much!!