Thymeleaf Interactive Tutorial

Exercise 9: more on conditions

This exercise introduces concepts from chapter 7 of the Using Thymeleaf manual.

  1. A List of Customer objects has been set into the context model with variable name customerList. This is a complex bean, containing properties of the Gender PaymentMethod enum types.
  2. Edit the source code in order to practice three different kinds of condition expressions. Use the comment hints at the HTML to guide you.
    Tip: use name() in order to obtain the String representation of an enum value.
    • In the gender column you must show a boy image, a girl image or an 'Unknown' text depending on customer gender.
    • In the payment method column you must show a warning message when payment is not credit card payment.
    • In the balance column you must add a specific CSS class when balance is above $10000.
  3. Now modify the template in order to obtain a more real-looking static prototype by adding some additional rows to the table (these rows should be removed when Thymeleaf executes).
  4. You can check the proposed solution by pressing the Show solution button () above the code editor.

Welcome to the Thymeleaf Interactive Tutorial. Thymeleaf version used in this tutorial is 2.1.5.RELEASE.

This interactive tutorial has been created by the Thymeleaf Team using The Thymeleaf Template Engine and other great open source tools like:

The tutorial is gracefully hosted at the Heroku Cloud Platform

Icons used in this app, except Thymeleaf logo, are created by Mark James

You can get the source code of this tutorial at GitHub.

You can find much more documentation on Thymeleaf at the Thymeleaf website.

For any questions or help, you can use the user forum.

Source code

Static view

Generated source

Dynamic view