Difference between th:with and th:if - thymeleaf

what is the difference between th:with and th:if in thymeleaf? Do I use th:if or th:with? I am not too sure of their difference.
I have tried to search for usage of th:with but there isn't much document around.
For example,
<td>
<div th:with="${a given condition}"> <!--do I use th:if or th:with here?-->
<span th:if="${}"></span>
<span th:if="${}"></span>
</div>
</td>

th:with is used to assign variables. It doesn't have anything to do with evaluating conditions, instead it's used to assign a value to a variable. The sytnax looks like this:
<div th:with="firstPer=${persons[0]}">
th:if and th:unless are used to evaluate conditions (to determine whether or not to show a block of html).
<div th:if="${user.isAdmin()} == false">

Related

th:with what is the difference between the two examples

<p th:with="firstName1='James1'">
<p>Upper</p><p th:text="${firstName1}"></p>
</p>
<p th:with="df='today'">
Today is: <span th:text="${df}">13 February 2011</span>
Could you tell me what is the difference between the two code sections. They seem identical for me. But there is some difference as the results differ.
Alright, I've never encountered this before... but it looks like Thymeleaf is enforcing the rule that Any <p> (or other block-level element) will implicitly close any open <p>. This works, for example:
<div th:with="firstName1='James1'">
<p>Upper</p>
<p th:text="${firstName1}"></p>
</div>
<p th:with="df='today'">
Today is: <span th:text="${df}">13 February 2011</span>
</p>
In your example, the firstName1 variable is out of scope because the parser is treating your HTML like this (so firstName1 is considered null):
<p th:with="firstName1='James1'"></p>
<p>Upper</p>
<p th:text="${firstName1}"></p>

How to pass a fragment to a message expression in Thymeleaf

Is it possible to pass a fragment to a message expression in Thymeleaf? I want to re-use fragments for creating links in messages.
My fragment looks something like this:
<div th:fragment="link(url, text)" th:remove="tag">
<a th:href="#{${url}}"><span>${text}</span></a>
</div>
and I have a message like that:
home.welcome=Hello User! See new content at {0}.
Now I want to pass the evaluated fragment to the message expression (pseudo-code):
<p th:utext="#{home.welcome(${link:: link(url='myUrl', text='myText')})}"></p>
The resulting HTML should look like this:
<p>
Hello User! See new content at <span>myText</span>.
</p>
I discovered Fragment expressions introduced in Thymeleaf 3 but I'm not sure if they are the way to go.
You can try th:with.
Call fragments like so
<div th:include="fragments/common :: link" th:with="url='www.google.com', text='Click Me'"></div>
This is your fragment
<div th:fragment="link" th:remove="tag">
<a th:href="#{${url}}"><span th:inline="text">[[${text}]]</span></a>
</div>
This is the HTML you will get
<div>
<a href="www.google.com">
<span>Click Me</span>
</a>
</div>

Dust templating, check if iteration is divisible by a number

Trying to check to see if an iteration is divisible by a number, and wrap it in a <div> if it is, but I can't seem to get it to work. Is there even a way to do this with Dust?
{#sitemap.items}
{#if cond="$idx % 2"}
<div class="row">
{/if}
<div class="sitemap-column col-6">
{#.}
//do stuff with the object
{/.}
</div>
{#if cond="sitemap.count % 2"}
</div>
{/if}
{/sitemap.items}
The easiest way is to use the math helper like this:
{#items}
{#math key=$idx method="mod" operand=2}
{#eq value=0}<div class="row">{/eq}
{/math}
{/items}

Can “field-with-errors” be attached to the parent of the input tag that raises the error?

So I have an input element like this. The wrapping element is about, you know, a visual thing.
<div class="input-wrap">
<input class="blah-blah" />
</div>
When the <input> contains the error, it'll be like this:
<div class="input-wrap">
<div class="field-with-errors">
<input class="blah-blah" />
</div>
</div>
But what I want to do is:
<div class="input-wrap field-with-errors">
<input class="blah-blah" />
</div>
I found this page, it's very close to my question
Rails 3: "field-with-errors" wrapper changes the page appearance. How to avoid this?
Now I know I can throw
config.action_view.field_error_proc = Proc.new { |html_tag, instance|
"#{html_tag}".html_safe
}
to avoid making a wrapping tag around the <input> tag that has an error on. But what I really wanna do is, again, adding "field-with-errors" class on the direct parent of the <input> tag. Can I do that? Does ActionView hold the tree structure of DOM Nodes?
You can put the code for handling errors wherever you like, just call it as a block on the instance variable, for example
if #instance.errors.any?
<div class="field with errors">
#instance.errors.full_messages.each do |msg|
<p><%= msg %></p>
end
end
If you user this a lot, it's good to pull it out into a helper and pass in the instance variable as a parameter.

MVC, make conditional output in simplest way

hi
i have a variable called isEnglish
if it is true I want to output something like this:
<div orientation="left"> </div>
otherwise:
<div orientation="right"> </div>
the following code failed to compile :
<div orientation="<%=isEnglish?? %>left<%:%>right<% %>"> </div>
I know a way which is long, by using the (if) and Writer.Write method
is there another simple way ?
<div orientation="<%= isEnglish? "left" : "right" %>"> </div>
You could use a conditional statement:
<div orientation="<%= isEnglish ? "left" : "right" %>"></div>
Or, preferably (to me at least), you would remove this logic from the View altogether and create a ViewModel. You can then put the logic in the mapping between the Model and the ViewModel.
That way you don't have spaghetti code in your View. It might look something like:
<div orientation="<%= Model.Orientation %>"></div>
The code you want is this:
<div class="<%= isEnglish ? "left" : "right" %>"></div>
But check out Razor if you're using MVC, much cleaner syntax.

Resources