Templates will translate each database row into an HTML fragment but only has access to the values of the row. To include data using a foreign key, you can return a new HTMX fragment and load that data using the key. For example an API row has database ID but to get the database name you need to fetch using a new request.
<td>
<div
hx-get="/api/v1/{{{customerId}}}/databases/{{{databaseId}}}/database-name"
hx-target="this"
hx-trigger="load"
hx-swap="innerHTML"
hx-cache="20s"
hx-indicator="this"
>
<div class="spinner-border spinner-border-sm htmx-indicator" role="status"></div>
</div>
</td>
Here the table cell contains div with HTMX request for the database API using the database ID in the row that will trigger after loaded to page.
Additionally the url contains an operation-part database-name so it will load a specific template for this context.
{{{name}}}
This will return just name and replace the original div with it. While waiting there is a spinner element that will also get overwritten by the name.