Selectively making elements visible in repeater per database?

Ask the community
,
1

I’m making a website for my wife to display her crouched items. To ease my efforts I created a database that holds titles and pictures and what not. Then I display the database in a repeater with data binding to show the image and title and notes. This was easy.

My wife will eventually sell them and I want to have the elements in place to do this. I added a price to the database and a Boolean of for sale or not. I want to display the price if for sale is true. This is proving to be very difficult.

First I tried the following. I added an event for when the text box with the price appears on screen, viewportEnter(event). What I thought would happen is that every repeater would trigger a new current item and that new data would be pulled for each one. What actually happens is that the first item of the database is pulled for every event of the repeater. So if the first item in the database is for sale then every item will show the price.

export function text21_viewportEnter(event) {
let item = $w(“#dataset1”).getCurrentItem().forSale;
console.log($w(“#dataset1”).getCurrentItem())
if (item === true ) {
$w(‘#text21’).show();
} else {
$w(‘#text21’).hide();
}
}

The second thing I tried was adding a checkbox to the repeater and data bound the checkbox to the for sale item. This way each repeater will automatically pull the data from the database automatically for me. Then I could see whether the box is checked and hid the text box with the price and the checkbox. The inspection of the check box happens during viewportEnter(event). What i’m finding is that the event triggers only once for the first item of the repeater and then once the check box is hidden it does not re trigger for the following items of the repeater.

export function checkbox1_viewportEnter(event) {
let item = $w(“#checkbox1”).checked;
console.log(item);
if (item === true ) {

    $w('#text21').show(); 
    $w('#checkbox1').hide(); 
}  **else**  { 

    $w('#text21').hide(); 
    $w('#checkbox1').hide(); 
}

}

Also if I don’t hide the checkbox, the checkbox always returns true regardless of whether the box shows up with a check or not.

Is there a way to fix one of my ideas or some other way to accomplish this?

2

In your code you are only accessing the Repeater, and not the items in the repeater. To manage the repeater items, use: onItemReady( ) , forEachItem( ) , forItems()

See the Repeater documentation for full details on how to use and configure a repeater.