When having a very long table, it might occur that in export it covers more than one page. For some tables, it would be incredibly helpful to have the header repeated on every page. Using HTML tables, we can now activate this by adding the class usr-repeated-header to the thead tag.
Let’s say we have a simple table showing all assets. The class usr-repeated-header will make sure headers are repeated in case the table would cover more than 1 page, like in the output of this example. Also, note that there is no width defined for the first column. It will dynamically take the remaining available width, based on whether the previous year columns are displayed. Please note that you can have only 1 column without specified width in HTML tables!
{% assign assets = period.accounts.assets %}
{% assign show_py = period.minus_1y.exists %}
<table class="usr-width-100">
<thead class="usr-repeated-header" >
<tr>
<th class=""> </th>
<th class="usr-width-5 usr-align-center usr-line-bottom"><b>Ref.</b></th>
<th class="usr-width-1"></th>
<th class="usr-width-14 usr-align-right"></th>
<th class="usr-width-14 usr-align-right usr-line-bottom"><b>{{ current_year }}</b></th>
{% if show_py %}
<th class="usr-width-1"></th>
<th class="usr-width-14 usr-align-right"></th>
<th class="usr-width-14 usr-align-right usr-line-bottom"><b>{{ prev_year }}</b></th>
{% endif %}
</tr>
</thead>
<tbody>
{% for asset in assets %}
<tr>
<td class=""><b>asset.name</b></td>
<td class="usr-align-center">2</td>
<td class=""></td>
<td class="usr-align-right"></td>
<td class="usr-align-right">{{ asset.value | currency }}</td>
{% if show_py %}
<td class=""></td>
<td class="usr-align-right"></td>
{% assign py_value = period.minus_1y.accounts | range:asset.mapped_number %}
<td class="usr-align-right">{{ py_value | currency }}</td>
{% endif %}
</tr>
{% endfor %}
</tbody>
</table>
Output page 1:
Output page 2:
