Foreign ID Fetching Name and ID Column Data Only

[Woodsy]

The below code pulls content from a HubDB column called <overview_items> which contains foreign ID data. The data that is surrently being pulled is the name and id columns of the foreign ID table.

{% for item in module.lp_select.columns.overview_items %}     
        <div class="card__details overview">
          <h3 class="card__title">
           {{item.name}}
          </h3>
          {{item.id}}
        </div>
{% endfor %} 

<name> and <id> pull data through but it if I use <icon>(image) or <test>(text) nothing is pulled through.

Am I able to adjust the code slightly to include:
<p>{{item.test}}</p> to show the test column data.

<img src="{{ item.icon.url }}"> to show the icon column data.

Here is the foreign ID table for reference.

Someone had advised me on a more complex way of pulling the data. I thought it best to keep this post seperate as I wanted to see if there was a more simplistic way to get the basic data seeing as <name> and <id> already pull data through so I know everything is connected up.

Thank you in advance

[chighsmith]

Hi @Woodsy,

Thank you for posting to the Community! 

I'd like to tag in some Top Contributors to see if they have any advice on this one -- Hi @HFisher7 @gabriel-nextiny and @Stephanie-OG Do any of you have any tips for @Woodsy?

Thank you!

Cassie, Community Manager

[MuhammadAmjad · Accepted solution]

Hi @Woodsy,

To access other columns from a foreign ID table in HubDB, you need to use dot notation to reference the foreign table's fields.

Instead of just {{item.overview_items}}, you'll need to access the specific columns like this:

{{item.overview_items.test}} - for the test column
{{item.overview_items.icon.url}} - for the icon image URL

The foreign ID column returns the entire row object from the referenced table, so you can access any column using item.foreignColumn.columnName syntax.

For your icon example:
<img src="{{item.overview_items.icon.url}}" alt="{{item.overview_items.name}}">

Does this help solve your issue?

[Woodsy]

Hi MuhammadAmjad, I just wanted to check in to see if you could see why my update using your suggestion dosen't seem to be working?

Thank you in advance for any assistance you are able to share.

[Woodsy]

Hi MuhammadAmjad

Thank you for taking the time to look over my problem. I tried adding the image to the page as suggetsed but unfortunalty I am unable to get the icon and alt tag to pull through.

<img src="{{item.overview_items.icon.url}}" alt="{{item.overview_items.name}}">

This is what I have written:

{% for item in module.lp_select.columns.overview_items %}     
        <div class="card__details overview">
          <h3 class="card__title">
           {{item.name}}
          </h3>
          <p>
            {{item.id}}
          </p>
          <img src="{{item.overview_items.icon.url}}" alt="{{item.overview_items.name}}">
        </div>
{% endfor %}

This is what is being showing the the live pages code:

Am I calling something incorrectly so that it doen't show?

Thank you in advance
James

[Woodsy]

Hi all, would you be abl;e to point me to someone who would be able to offer me any tips or guidance on the best way to fetch the data from the foreign ID scond DB? Using <name> and <id> pull data through but I assum thats due to a default column name. If I try and call a column from the foreign DB for example <test> nothing is pulled.

Thanks