Retrieve image from collection and display on page with code

Ask the community
,
1

I have a collection of images (selfies) that I would like to display on a page. Here is my code but it is not working. (I cannot simply just link the page to the collection because the page is already dynamically linked with another collection)

	wixData.query("Selfie") 
		.eq("playerName", ($w("#playerName").text).toString()) 
		.find() 
		.then((results) => { 
			let item = (results.items[0]); 
			if (item.selfie === undefined) { 
				
			} else { 
				$w("#selfieImage").src = (item.selfie); 
			} 
		}); 
}

I would like the image on the page to be set to its default image if the player has not already added their picture, but if they have I want the picture to be retrieved from the collection Selfie (playerName is unique).

Thanks in advance!

2

Hey,

I’ve checked the code - actually it works for me.

Could you tell me more what is not working? What is the flow now?

You can also add .catch to catch and log an error:

wixData.query("Selfie")
			.eq("playerName", ($w("#playerName").text).toString())
			.find()
			.then((results) => {
				let item = (results.items[0]);

				if (item.selfie === undefined) {
					console.log("no image");
					
				} else {
					$w("#selfieImage").src = (item.selfie);
				}
			})
			.catch( (err) => {
  				  let errorMsg = err;
  				  console.log(err);
  				} );

Also, what is the element here: $w(“#playerName”).text ? Is this text label on your page?

3

Thanks for your reply!
I deleted the code, then copied it back in and it them worked.
Not sure why it wasn’t working yesterday.

Thanks for verifying that it was correct!