Code Question: Hide elements in repeater if field X contains Y

Ask the community
,
1

Question:
On my Editor X website i have a repeater. In the database, there is a fieldkey called “segmentType”. I would like to achieve the following: If “segmentType” = X, I would like container A to be collapsed and container B to be expanded. I am using the below code. What am I doing wrong? :slight_smile:

$w.onReady(function () {
$w(‘#dayOneDataset’).onReady(() => {
$w(‘#repeater17’).onItemReady(($item, itemData) => {
let segmentType = itemData.segmentType;
if (segmentType === “TRANSPORTATION/FLIGHT” || segmentType === null || segmentType === undefined) {
$item(“#day1staycontainer”).collapse();
} else {
$item(“#day1flightcontainer”).collapse();
$item(“#day1staycontainer”).collapse();
}
})
})

});

Product:
Editor X

Thanks in advance!! :pray: :pray:

2

I’ve made a minor change, see of this works:

$w.onReady(function () {

  $w(‘#dayOneDataset’).onReady(() => {

    $w(‘#repeater17’).onItemReady(($item, itemData) => {
    
      if(itemData.segmentType) {
    
        let segmentType = itemData.segmentType;
    
        if ((segmentType == “TRANSPORTATION/FLIGHT”) || (segmentType == null) || 
        (segmentType == undefined)) {
        $item(“#day1staycontainer”).collapse(); //Handle case if segmentType is TRANSPORTATION/FLIGHT or does not have any value
        } else {
        $item(“#day1flightcontainer”).collapse();
        $item(“#day1staycontainer”).collapse(); //Handle case if segmentType has some other value
        }
    
      } else {
      $item(“#day1staycontainer”).collapse(); //Handle case if segmentType does not exist
      }
    
    });

  });

});

Also,

You are not expanding anything in the code? :smiley:

3

Hi Pratham,

Thanks so much for your suggested code! I cannot seem to get it right with your code. Maybe we can make the approach a little different to make the code easier; if I set the “day1flightcontainer” collapsed by default and just have the code expand it you’d say that it would be like this right:


$w.onReady(function () {
    $w('#dayOneDataset').onReady(() => {
        $w('#repeater17').onItemReady(($item, itemData) => {
           if(itemData.segmentType) {
            let segmentType = itemData.segmentType;
            if (segmentType === "TRANSPORTATION/FLIGHT") {
                $item('#day1flightcontainer').expand(); //Handle case if segmentType is TRANSPORTATION/FLIGHT or does not have any value
            }
            } 
    });
  });
});```

Thanks, happy new year!!
1 Like
4

Try to help yourself using some console.logs…

$w.onReady(function () {
    $w('#dayOneDataset').onReady(() => {
        $w('#repeater17').onItemReady(($item, itemData) => {console.log(itemData);
            console.log(itemData.segmentType);
            if(itemData.segmentType) {
               let segmentType = itemData.segmentType;
               if (segmentType === "TRANSPORTATION/FLIGHT") {
                  $item('#day1flightcontainer').expand(); 
                  $item('#day1flightcontainer').show('fade'); 
               }
               else {console.log('ELSE-1');}
          } 
         else {console.log('ELSE-2');}
    });
  });
});
5

Yes, this should very much do the job.

And Happy New Year to you too! (: