How to display email address in Thymeleaf by using <th:utext>?

Question

I have to display below text in thymeleaf, but it fails to display and not sure the reason and the resolution for this.

Below is the text which is coming from JSON format and I am parsing this json object and setting it in POJO Entities for Thymeleaf to render.

I am expecting below output:

If I use <span th:text="${comment.commentText}"></span>, email address displays properly but I lost formatting, meaning everything displays in one line regardless of line breaks, but if I use <span th:utext="${comment.commentText}"></span>, thymeleaf fails to render (without email address field in my commentsText, thymeleaf renders text with line breaks by using th:utext).

UPDATE:

I tried andrewJames suggested solution by replacing < and > with < and > It works to replace email brackets but failed to display the line breaks in thymeleaf.

Java Code:

commentData.setCommentText(comment.replaceAll("(\r\n|\r|\n|\n\r)", "<br>")
                        .replaceAll("\t", "&nbsp;&nbsp;&nbsp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;")
                );

After replace, here is my comment.getCommentText() data

  Entered comments: <br><br>One <br>Two <br><br>My Email: <[email protected]>

Thymeleaf code

            <span th:utext="${commentText}"></span>

and the output is:

I am not sure the reason why <br> tags were not rendering if I put extra lines of code at the end of my string variable replaceAll("<", "&lt;").replaceAll(">", "&gt;")

Thank you for your time and any inputs would be appreciated.

Answer 1

If the e-mail address is hard-coded, why not use:

<[email protected]> 

This produces the text <[email protected]>.

(no need to use Thymeleaf at all).

---

If the e-mail address needs to be provided by a model attribute, put it in a span - something like:

<span th:text="|&lt;${email}&gt;|"></span>

This uses |...| as a string concatenator.

You can use this <span> to get the precise layout you want.

---

Reference: For sequences such as < see Which characters need to be escaped in HTML?

---

Just to add: If you don't need to use th:utext then you should avoid using it. It represents a security vulnerability, if you use it to display user-provided data (any data where you do not have full control the value being displayed).

---

Update

Based on the clarifications added to the question.

In this case you have a complete string. In order to use < and > to surround the e-mail address you need to do 2 things:

1. Replace those specific < and > characters with their HTML escape codes, in the string, before passing it to Thymeleaf.

2. Use th:utext in the Thymeleaf expression, to ensure the other HTML tags in the string (such as <br>) are processed as HTML and not as literal text.

The string becomes this:

Entered comments: <br>One <br> Two <br> My Email: &lt;[email protected]&gt;

The Thymeleaf is this:

<div th:utext="${comment.commentText}"></div>

How you perform that replacement of those two specific < and > characters is up to you - there are various possibilities.

Given you (presumably) need to parse the JSON before you can render its contents via Thymeleaf, then you can do the replacement at that point.

A Java regex replacement would be one approach:

.*(<).*(>)

You can then target those two capturing groups at the end of the string - the (<) and (>) - and replace them with their HTML escape sequences.

But none of that relevant code is shown in the question, so this is speculation.

I would recommend asking a new, specific, focused question for that new, specific step if the solution is not obvious (I say this because it significantly changes the question you originally asked here - and therefore should be a new question.)

---

Perhaps this will point you in one possible direction (I am sure there are many other approaches which could also work):

final String string = "Entered comments: <br>One <br> Two <br> My Email: <[email protected]>";
// separates the final < and > characters (creates 4 groups overall):
final String regex = "(.*)(<)(.*)(>)";
// replaces group $2 (final <) and group $4 (final >) with the HTML escape characters:
final String subst = "$1&lt;$3&gt;";
final Pattern pattern = Pattern.compile(regex);
final Matcher matcher = pattern.matcher(string);
final String result = matcher.replaceAll(subst);
// result: "Entered comments: <br>One <br> Two <br> My Email: &lt;[email protected]&gt;"
System.out.println(result);