Thymeleaf: How to exclude outer tag when using th:each?

Question

Thymeleaf: How to exclude outer tag when using th:each?

14.8k views Asked by July At 18 June 2015 at 11:52

The Thymeleaf 2.1.4 official doc demonstrates the for each usage as below:

 <tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">
    <td th:text="${prod.name}">Onions</td>
    <td th:text="${prod.price}">2.41</td>
    ...
 </tr>

It generates one <tr> in each iteration, which is perfect fit in this situation. However in my case I don't need the outer tag (here, <tr>).

My use case is to generating <bookmark> tag in a recursive way, no other tags include, and a <bookmark> tag must contain a name and href attribute.

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<body>

<div th:fragment="locationBookmark(location)">
    <bookmark th:each="map : ${location.subMaps}">
        <bookmark th:name="${map.name}"
                  th:href="'#'+${map.id}" th:include=":: locationBookmark(${map})">
        </bookmark>
    </bookmark>
</div>
</body>
</html>

the including side:

<bookmark th:include="bookmark : locationBookmark(${rootLocation})"/>

Many thanks.

Original Q&A

There are 4 answers

shazin On 18 June 2015 at 12:19

You can use a DIV tag or any other HTML tag to loop with. This will not generate a TR tag. But for the table to render correctly you need to have the TD tags inside of TR tags.

<div th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">
    <td th:text="${prod.name}">Onions</td>
    <td th:text="${prod.price}">2.41</td>
</div>

July On 19 June 2015 at 05:17

I figured out how to solve the problem, it's easy, just addth:remove="tag" to the outer tag will do.

Sofía On 14 September 2020 at 18:38

This isn't exactly what the OP asked for but it could be useful to some:

A tag can also be removed conditionally:

<div class="myConditionalOuterDiv" th:remove="${condition}? tag"}> 
    <span> I'm always there </span>
</div>

This removes the parent element but leaves the children elements in place.

Source here

**Xipo** · Accepted Answer · 2015-06-19 13:54:02

Even if it can be done using th:remove="tag" I would suggest you use th:block

<th:block th:each="map : ${location.subMaps}">
   <bookmark th:name="${map.name}"
        th:href="'#'+${map.id}" th:include=":: locationBookmark(${map})">
    </bookmark>
</th:block>

TechQA.

Thymeleaf: How to exclude outer tag when using th:each?

There are 4 answers

Related Questions in JAVA

Related Questions in TEMPLATE-ENGINE

Related Questions in THYMELEAF

Popular Questions

Popular Tags

Trending Questions