Hello,
I am using Wix repeater component to display data from object array. Every item in repeater is clickable. I what i want to accomplish is when user clicks item,item should be marked ( black border appear on selected item to indicate it is clicked ),while every other item should not be marked.
With current approach,described with code below i get wanted behavior only if user clicks element with higher index form previously clicked item.( Example, item 1 is clicked, than item 3… -Works as expected!) But if for example item 5 is clicked and than item 2 both will be marked at the same time, and so on, if after it item 1 is clicked 3 of them will have border.
Can you please look at code below and help me find out what is the reason for this odd behavior:
let previousItemIndex=0
…
//#borderbox on_click function should mark new item and clear previously selected
export function item_click(event, $w) {
var newSelectedItemId=event.context.additionalData.itemId;//get newly selected item index
if(previousItemIndex!==newSelectedItemId)
$w(“#ReapetersLoop”).forItems( [previousItemIndex], ($t, itemData, index) => {
$t(“#borderbox”).style.borderColor=“#FFFFFF”;
} ) ;
$w(“#borderbox”).style.borderColor=“#000000”;
previousItemIndex=newlyselected; // save info about clicked item
}