thymeleaf adding html escape charaters

Question

I am trying to send an event to plausibles api for tracking revenue. The problem is that the price is being escaped by thymeleaf. This leads to the api not getting the correct information.

The problem comes from [[${result.price}]] Which results in amount: quot;1234quot; just entering 1234 as amount: 1234 will result in correct storage of the results in the api.

Code for calling the window function

    <div class="product-card" th:each="result : ${searchResults}">
        <div class="product-image">
            
            <a th:href="@{${result.url}}" target="_blank" rel="noopener noreferrer"><img
                    class="product-thumb plausible-event-name=product+click"
                    th:onclick="window.plausible('product click', {revenue: {currency: 'SEK', amount: [[${result.price}]] }})"
                th:src="${result.imageUrl}" onerror="this.src='Product-Image-Coming-Soon.jpg'" alt=""></a>

        </div>

Returned result

<img class="product-thumb plausible-event-name=product+click" onclick="window.plausible('product click', {revenue: {currency: 'SEK', amount: quot;1234quot; }})" src="https://cdn-1.xxx.com/UMPROhsfQv4SWki4SpOhY9O6hydA9CI09YTchmT2mbQ.jpeg" onerror="this.src='Product-Image-Coming-Soon.jpg'" alt="">

Answer 1

When using thymeleaf in javascript inline [[${var}]] wil escape characters. If you don't want to escape characters in javascript you should use [(${var})].

See the Thymeleaf documentation about inlining for more info https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#inlining