Only variable expressions returning numbers or booleans are allowed in this context

javascript html spring spring-boot thymeleaf

10,050

Solution 1

I was able to have it working by using this approach

<body>

<script th:inline="javascript">
    /*<![CDATA[*/

    var flag = [[${timerEnabled}]]; // if timer should be included or not
    var timeRemaining = [[${timeRemaining}]]; // the time remaining.
    window.onload = function() {
        if(!flag)
            return; // Exit/Return if the variable is false
        runTimer(timeRemaining); // Call your favourite method if the variable is true
    };

    /*]]>*/
</script>

Any other approach such as suggested in the exception is appreciated.

Solution 2

Since Thymeleaf 3.0.10 they fixed a security-bug regarding unescaped code.

Try

<body th:onload="[[${timerEnabled}]] ? 'javascript:runTimer(\'' + 
[[${timeRemaining}]] + '\');'">

Or the recommended way:

<body th:data1="${timerEnabled}"
  th:data2="${timeRemaining}"
    th:onload="this.getAttribute('data1') ? javascript:runTimer(this.getAttribute('data2'));">

Solution 3

Try it this way.

<body th:onload="${timerEnabled eq true} ? 'javascript:runTimer(\'' + ${timeRemaining} + '\');'">

If it doesn't work, you can also try using th:if.

<th:block th:if="${timerEnabled} eq true">
    <body th:onload="javascript:runTimer(\'' + ${timeRemaining} + '\');'">
    </body>
</th:block>
<th:block th:if="${timerEnabled} eq false">
    <body></body>
</th:block>

I know, the other version does look much better, but since it is not working, this one is not so bad. Of course, I wouldn't recommend adding it to your bode in this case.

What I find weird, is that I try your code it does work on my end. Who knows why you are getting that error.

10,050

Author by

Knight Rider

Updated on June 06, 2022

Comments

Knight Rider about 2 years

I am trying to pass a value to my javascript function but that function call depends on a boolean variable. I had this working fine until I recently upgraded to thymeleaf security 5.

This is the code snippet.

<body th:onload="${timerEnabled} ? 'javascript:runTimer(\'' + ${timeRemaining} + '\');'">

timerEnabled has to be true for the function call to be done but thymeleaf now throws an exception as

org.thymeleaf.exceptions.TemplateProcessingException: Only variable expressions returning numbers or booleans are allowed in this context, any other datatypes are not trusted in the context of this expression, including Strings or any other object that could be rendered as a text literal. A typical case is HTML attributes for event handlers (e.g. "onload"), in which textual data from variables should better be output to "data-*" attributes and then read from the event handler.

How can I resolve this? Thank you.

Knight Rider over 5 years

I just tried your code snippet and it does not work. I realized that the issue is with the "String" variable being passed to the javascript function within the handler (onload). I started getting this error after I upgraded and maybe it's due to the updte. github.com/thymeleaf/thymeleaf/issues/705
Alain Cruz over 5 years

Not even the one using th:if? I tried them both and they worked. It has to be the update, but that is quite odd.
Knight Rider over 5 years

The one in the if also gives the error but requires that I have the content in two separate blocks. I think it's because of the update and they made it a strict mode not to allow passing strings directly in handles according to the exception. But again, thank you very much because I learned something new from your response.
leome about 5 years

Do you mean the first example or second? And what do you mean by as of 2019, any certain version of thymeleaf?
rahmatns almost 5 years

I can confirm this works! Using newest thymeleaf on 2019. This is way better and cleaner than the th:inline javascript method where you use CDATA like the other answer mentioned.