Spring Boot Bootcamp – Workbooks and Challenges
)}

Challenge – Part 2 (follow-up)

In this challenge, you will apply utility methods inside your templates.

Task 1

The inventory page starts with static data. Populate the inventory table with data from the datastore.

Controller

@GetMapping("/inventory") public String getInventory(Model model) { model.addAttribute("items", items); return "inventory"; }

Template

<tr |LOOP|> <td th:text="${element.field}"> </th> <td th:text="${element.field}"> </td> <td type="currency" th:text="${element.field}"> </td> <td type="currency" th:text="${element.field}"> </td> <td type="date" th:text="${element.field}"> </td> <td> <a role="button" style="color:white; background-color: #263238" class="table-button">Update</a> </td> </tr>

Output:

From the homepage, try to submit an item.

Screen Shot 2022-06-02 at 4.00.49 PM.png

th:text displays a tedious toString representation of your Date.

Task 2: Option A (Not Recommended)

Add another method to your POJO class.

public String getFormatDate() { SimpleDateFormat formatter = new SimpleDateFormat("yyyy-MM-dd"); return formatter.format(date); }

Use th:text = "${element.formatDate}" to fetch the formatted date from getFormatDate().

Screen Shot 2022-06-02 at 4.01.15 PM.png

Task 3: Option B (Recommended)

You should format visual output using Thymeleaf.

The Dates class (#dates) from the Thymeleaf Repo contains a format method that accepts two arguments:

1. The date you are formatting.

2. The pattern used to format it.

Screen Shot 2022-08-16 at 1.08.22 AM.png

Using this information, format your date to a pattern of 'yyyy-MM-dd'

Screen Shot 2022-06-02 at 4.01.15 PM.png

Task 4

Remove the type="currency" attribute for price and discount. Use the formatCurrency method provided by #numbers.

Screen Shot 2022-08-17 at 2.31.34 AM.png

Good Luck!

Feedback Summary
5.0
3 students
5

100%
4

0%
3

0%
2

0%
1

0%
Written Reviews
There are no written reviews yet.