I’m using Django, if that makes any difference. Anyway, I have this tbody
element in my template:
<tbody
id="log-stream-table-body"
hx-get="{% url 'pages:log_stream_rows' %}?last_ts={{ last_log_ts }}"
hx-trigger="every 30s"
hx-target="this"
hx-swap="afterbegin"
>
{% include "pages/_home_log_stream_rows.html" with log_stream=log_stream %}
</tbody>
The url it’s pointing to returns this template snippet (which is actually pages/_home_log_stream_rows.html
used in the include above):
{% for log in log_stream %}
<tr>
<td>{{ log.ts|date:"Y-m-d H:i:s.u" }}</td>
<td>{{ log.process }}</td>
<td>{{ log.source }}</td>
<td>{{ log.message }}</td>
</tr>
{% endfor %}
<div
id="log-stream-hyperscript"
hx-swap-oob="outerHTML"
data-log-ts="{{ last_log_ts }}"
></div>
The problem is that I’m returning multiple tr
elements at the top level, so the whole thing just fails.
I can wrap it in a <template>
tag, and it works, but of course then nothing is visible. Wrapping in anything else (div
, andother tbody
) just breaks the display in different ways.
How can I group these multiple tr
elements so that htmx adds them in correctly at the top of my table?