Displaying Image in Table, using URL as Image

💬 App Building
1

Here I am simply trying to display a logo within the row of each record.

The API responds with the URL of the file. I can't seem to figure out the proper syntax to map this as the Image URL.

This is an array of items for the table. Name, Phone, Email all map fine.

image

The "Undefined" is simply unclear to me as to why it's undefined when this is the path.

image

2

Hello @MattK ,
Welcome to the Retool Community,

I understand the issue you're facing. You can resolve it by updating your inline script as follows:

{{ table8.selectedSourceRow.logo?.url || 'https://example.com/default-image.png' }}

take a look at the screenshot for more clarification.

image
image1110×635 103 KB

5 Likes
3

The table8.selectedSourceRow.logo?.url or in my case would be clientsTable.selectedRow.logo?.url still does not return the actual URL of the image.

Is there something I'm doing wrong with the dot notation?

image

image

4

Perhaps the issue is that the column isn't loading the image, so the selectedRow won't work until that happens.

So where {{ item }} exists, what would I be putting here to pull the image URL given the previous reply? Should be dot notation of logo.url as far as I can tell.

image

As I dig it's as if the logo object can't be used.

image

5

It's rather unclear to me how this magically works given the displayed error. With that said, at least it works. What I likely overlooked is I already had the "source" selected which means I didn't need the full dot notation in the mapped value.

All I needed was something more simple than met the eye.

{{ item.url }}

image

6

It helped me also, Thank you so much.

2 Likes