Your Privacy

This site uses cookies to enhance your browsing experience and deliver personalized content. By continuing to use this site, you consent to our use of cookies.
COOKIE POLICY

Skip to main content

Spring Thymeleaf Tips | Part 1

Spring Thymeleaf Tips | Part 1
Back to insights

We’ve been developing a UI using Spring Thymeleaf (2.1.2) on our team. I’ve noticed a serious dearth of examples outside of specific questions on Stack Overflow, so I figured I’d throw my hat in the ring and offer a few tips and tricks we’ve picked up over the 10 or so months working with this templating system. This is part one of a series. In each exploration, we will examine a few different pieces of Thymeleaf that could make your life a little easier. This first one is a few tips and tricks that should help keep your templates a little more readable.

Make Function Calls Into Your POJOs

Sometimes we need a little more power behind our retrieval operations. When it’s too complicated to try and manage it inline or Thymeleaf’s expressions don’t cover your use case, you can always use a formatter method on your domain object and call that directly in the template.

Let’s say we have a list of people with addresses, and we want to format the second address field on its own line if it’s there. We could use a ternary operator for that in a big messy concatenation, but for the sake of readability, it’s easier to wrap it in a function and let the model serve up the formatted text.

This markup produces:

Use Ternary Operators for Unreliable Info

Sometimes you run across a case where a piece of data isn’t present yet in the state of your application. In some of these cases, clever use of the ternary operator can make for an inline data swap instead of having to use th:if or th:block.

Use RowStat to Grab the Index Th:Each

There’s a secondary argument available to th:each – rowStat. It allows you to access certain values around the collection you are iterating over.

Use Th:Field for Fun and Profit

If you don’t want to type the name of your input over and over again, use th:field. It turns this:

into this:

Use Th:Object for Cleaner Templates

For a specific block of code, you can use th:object to allow direct reference to an object’s members. Once we do that to our table, it looks like this:

Note the change in the notation from ‘$’ to ‘*’. This tells Thymeleaf to look up the tree for a parent object.

That’s all for today. Next time we’ll cover standard expression libraries, Java 8 time expressions, data types and integrating Thymeleaf service objects with your javascript.

Digging In

  • Digital Products

    What to Ask in a UX Discovery Session

    Better questions lead to better design. In my years as a UI/UX designer, I’ve learned that many design challenges may come from misalignment at the start. Discovery sessions are where product clarity is either made or missed. These are a few discovery questions I consistently return to in the discovery phase of my UX design […]

  • Digital Products

    Designing For Play and Friction in a Fast-Paced World

    At UDig, play is an integral part of our philosophy. “Having fun” is embedded in our culture, and we always find opportunities to use play to encourage collaboration, ignite creativity, and make room for bold experimentation to build stronger teams and solve problems ranging from the seemingly simple to the most complex. I always have […]

  • Digital Products

    Config 2025 Day Two Recap

    It felt as though Config 2025 ended as soon as it began, and I believe those of us that attended are all the better for it. By the end of the day, various inspirational and informative talks had been given by thought leaders and innovators in the product space. Between sessions, we had the opportunity […]

  • Digital Products

    Inside Config 2025: What’s New in Figma

    Config 2025 kicked off with a bang on Day 1. Figma’s annual conference brings together designers, developers, and all those involved in the making of a product. The 2-day event has a stacked lineup of accomplished speakers ready to share their insights on the world of product building. At today’s opening keynote, the Figma team, […]

  • Digital Products

    Choosing the Right Modernization Approach

    When organizations decide it’s time to modernize their technology infrastructure, choosing the right approach is crucial. Modernization isn’t merely a technical upgrade; it’s a strategic business move that significantly impacts growth, agility, and long-term success. Here’s how your company can effectively begin to select the best modernization strategy tailored to your goals and challenges. In […]

  • Digital Products

    TAG Panel: Differentiate Your Customer Experience

    Join the CX and Product Management Societies to hear from our panel of Human-Centered Design experts on the business value of Agentic AI.