Question:
I’m trying to populate a repeater with data from a .json feed. I have very little coding experience and have watched Wix’s tutorial series about repeaters and coding with Velo. My backend code works fine, but my frontend code isn’t working. When I run the code no information populates my repeater:
Product:
Wix Editor dev mode
What have you already tried:
I’ve tried some variations on the code used in the Coding with Velo video series about repeaters, as well as read the Velo Reference pages.
Several of the examples had a string of code at the end like this, and I’m wondering if that’s what I need to add to my code:
$w(‘#eventsRepeater’).data = ???
But I have no idea what to put where the question marks are. ![:slight_smile: :slight_smile:](https://emoji.discourse-cdn.com/google_classic/slight_smile.png?v=12)
Any thoughts would be helpful.
Thank you!!
I think all external data needs to have an ‘_id’ key to show in the repeater
First you need a reference to your data
// i like async to do the load and get the reference
const yourDataArray = await getEvents()
// Im not as familiar with promises but it might look something like this with the 'response' containing the reference to your array
getEvents().then((response) =>
)
// Add this after onItemReady and change your_item_id_key to whatever your id key is
// This is just adding a '_id' key using the id key from your database
const externalRepeaterData = yourDataArray.map(item => {
item._id = item.your_item_id_key.toString();
return item;
});
// Set the new data with _id key to the repeater
$w('#eventsRepeater').data = externalRepeaterData;
As long as the data is good and elements are properly named it should work
More info here:
Side note I’ve had null images that also prevented the rest of the cell from populating the data so something like this can help if not everything will have an image:
const itemPhoto = itemData.image;
if (itemPhoto != null) {
$item('#eventImage').src = itemPhoto; // itemPhoto is the image url string
}
1 Like