# Custom HTML Table - Context Tags

**URL:** <https://forums.losant.com/t/custom-html-table-context-tags/4463>\
**Category:** Help\
**Tags:** dashboard\
**Created:** [April 13, 2022, 7:40pm UTC](https://forums.losant.com/t/custom-html-table-context-tags/4463 "2022-04-13T19:40:01Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![ChrisGM](https://avatars.discourse-cdn.com/v4/letter/c/51bf81/32.png) [@ChrisGM](https://forums.losant.com/u/ChrisGM)\
**Post date:** [April 13, 2022, 7:40pm UTC](https://forums.losant.com/t/custom-html-table-context-tags/4463/1 "2022-04-13T19:40:01Z")

</div>

I’ve created some custom HTML tables, successfully using context variables and device tags.

I’m now stuck trying to use a context variable tag, to label a column. I think the issue is my trying to use the tag in the Body, rather than the Head content. I’m hoping you can assist?

In my Head content, I can populate the rows of data using this code in a loop:

```auto
<tr>
              <td>${moment(point.time).format('DD MM YYYY')}</td>
              <td>${DashboardBlock.input.ctx["deviceId-0"].tags.SN["0"]}</td>
              <td>${DashboardBlock.input.ctx["deviceId-0"].name}</td>
              <td>${input.queries.float1[i].value.toFixed(3)}</td>
              </tr>

```

However when I try to use the same tag to label a column in the Body content the lookup doesn’t work:

```auto
<thead>
      <tr>
        <th scope="col">Date</th>
        <th scope="col">SN</th>
        <th scope="col">Name</th>
        <th scope="col">${DashboardBlock.input.ctx["deviceId-0"].tags.SN["0"]}</th>
      </tr>
    </thead>

```

---

<div class="post-metadata">

**Author:** ![Brandon\_Cannaday](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.losant.com/brandon_cannaday/32/14_2.png) [@Brandon\_Cannaday](https://forums.losant.com/u/Brandon_Cannaday)\
**Post date:** [April 13, 2022, 7:58pm UTC](https://forums.losant.com/t/custom-html-table-context-tags/4463/2 "2022-04-13T19:58:24Z")

</div>

I believe the issue is that your first snippet is being executed in JavaScript and your second snippet is not. The Body content is plain HTML, so those [template literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals) won’t be evaluated.

A possible solution is to give the column header element an ID, which you can then reference and populate in the JavaScript code:

Body content:

```auto
<thead>
      <tr>
        <th scope="col">Date</th>
        <th scope="col">SN</th>
        <th scope="col">Name</th>
        <th scope="col" id="tag_column"></th>
      </tr>
</thead>

```

Then, in the Head content, in the same function with the loop that’s populating the rows, you can set that element’s value:

```auto
document.getElementById('tag_column').innerHTML = DashboardBlock.input.ctx["deviceId-0"].tags.SN["0"];

```
