Load gallery from database

Ask the community
,
1

Hi,
I try to load a gallery with data/photos from the database, but I get the error message “The src parameter of item at index 0 is required for items method.”
But the src parameter is on position 0 - or not?
Could anybody help me with this?

 export async function fillGallery1 () {
if (dataComplete.year === false || dataComplete.month === false) {
return;
}
await checkPhotosUploaded();

if(photosUploaded > 0) {
let photosToShow = [{
"src": "",
"type": "",
"alt": "",
"title": ""
}];
for (let i = 0; i < photosUploaded; i++) {
photosToShow[i] = [{
"src" :             photosUploadedItems[i].photo,
"type":             "image",
"alt" :             photosUploadedItems[i].description,
"title" :           'Photo téléchargé par ' + photosUploadedItems[i].uploadedby
}];
}
console.log(photosToShow);
$w('#gallery1').items = photosToShow;
}
else {
return;
}
}

The array photosToShow look like this:
Array(1)

0:
Array(1)
{"src":"image://v1/246733_991cddaf189642c193fa4ca2dc4be977~mv2.jpg/1400_787/246733_991cddaf189642c193fa4ca2dc4be977~mv2.jpg","type":"image","alt":"Rhododendron vor dem Stall in Blüte.","title":"Photo téléchargé par Urs Luginbuehl"}"

Thanks a lot!

2

This is usually a code error that comes to say that you are assigning an array of options that are not built correctly.

See here how options are suppose to be built.
https://www.wix.com/corvid/reference/$w.Gallery.html#ImageItem

For a basic way of doing images to gallery from dataset see here.
https://www.vorbly.com/Vorbly-Code/WIX-GALLERY-IMAGES-FROM-DATABASE

3

Thanks for that, but it helps me not really. Actually I’ve already studied the whole reference regarding the gallery, but it didn’t help me to build correctly the array or /options?
I also searched the forum for a example code how to build the array, but I didn’t find something. By the way I don’t work with a dataset!
I’m sorry, but I did my first steps in JavaScript some days ago, so nothing is really clear to me.
I get x items with 3 fields each (photo, title, description) from the database by wixdata.query. The only question is: How can I build the correct array in order to load the gallery.
But ok, I’ll find the solution.

4

I found a solution, but unfortunately it’s not a clean one. Perhaps, anyone can tell me how to define the array correctly :slight_smile:

if(photosUploaded > 0) {

$w('#galleryPhotosUploaded').items = [];
let photosToShow = [{
"type":         "image",
"description":  photosUploadedItems[0].description,
"title":        'Photo téléchargé par ' + photosUploadedItems[0].uploadedby,
"src":          photosUploadedItems[0].photo
}]

for (let i = 1; i < photosUploaded; i++) {
photosToShow.push ({
"type":         "image",
"description":  photosUploadedItems[i].description,
"title":        'Photo téléchargé par ' + photosUploadedItems[i].uploadedby,
"src":          photosUploadedItems[i].photo
})
}
console.log(photosToShow);
$w('#galleryPhotosUploaded').items = photosToShow;
}