Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialjames white
78,399 PointsCorrect the task anchor so that it displays the proper task (given by task.description)
I re-watched the video dozens and dozens of times:
Time index 2:50 seems most applicable where they have this code:
<div class="categories container">
<div class="row">
<!--
Repeat the div element for each object in the 'categories'
collection of the model map. Each object in the loop
should be named 'category'
-->
<div th:each="category : ${categories}" class="col s12 l4">
<div class="card">
<div class="card-content">
<div class="card-title">
<!--
Set the href attribute of the a tag to be the URI to
a specific category according to the category's id.
For example, /category/1 or /category/2
Then, set the text between the a tags to be the category name,
coming from the 'name' field of the 'category' object
in the model map
-->
<a th:href="@{'/category/' + ${category.id}}" th:text="${category.name}">Category Name</a>
</div>
</div>
</div>
</div>
</div>
</div>
..which corresponds roughly to the line below that has 'th:text=":
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<meta description="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" th:href="@{/app.css}"/>
<title>Task Manager</title>
</head>
<body>
<h1>My Tasks</h1>
<ul>
<li th:each="task : ${tasks}">
<a href="@{'/tasks/' + ${task.id}}" th:text="task.description">Task Description</a>
</li>
</ul>
</body>
</html>
The only trouble is they are using li tags instead of div tags
and the challeneg code is using 'th:each'
while the code in the video (and the zip download for the course) does not.
That subtle different is enough to throw me off..
The only clue/hint:
"Bummer! Thymeleaf doesn't know that it should process anything in the href attribute. Is there something you're forgetting?"
So, I'll just post this forum thread for the final challenge of the course
and hope that someone else was confused about this fix challenge as me.
I thoroughly do not understand Thymeleaf templating...
A little bit latter I was studying the 'category.html' file in the zip download and saw this line:
<a th:href="@{'/gif/' + ${gif.name}}">
...so I tried:
<li th:each="task : ${tasks}">
<a th:href="@{'/tasks/' + ${task.id}}" th:text="task.description">Task Description</a>
</li>
This gave me a different error:
"Bummer! Your th:text attribute value isn't correct. Be sure to use the correct symbols when inputting a variable expression with Thymeleaf."
Am I making progress? --who knows..
Several hours later...
<li th:each="task : ${tasks}">
<a th:href="@{'/tasks/' + ${task.id}}" th:text="${task.description}">Task Description</a>
</li>
Could a dollar sign and some curly brackets really make that much of a difference..?
Turns out it could!
Khoff Khak Khak!!
(that's me trying to cough up the throat gagging hairball that is Thymeleaf templating...)
Alastair Herd
2,306 PointsThank you too!
1 Answer
Mary McCallum
5,483 PointsThanks for this. Ironically, the wording of the question here tripped me up, I ended up changing something I didn't even need to!
Sagar Thakkar
8,814 PointsSagar Thakkar
8,814 Pointsyou helped lot man thanks!!