Thymeleaf th:each in javascript

I hope I am posting this in the right part of the forum.
I have this code where I should be able to get the room type enums and display them but I am not able to retrieve the enums in Thymeleaf inside the JS code. I am not sure what I am doing wrong, perhaps it is the Thymeleaf syntax in JS. I get only the hardcoded Single value.

The code:

<script th: inline = "javascript" >
    /*<![CDATA[*/
    $(document).ready(function() {
        $('#typeNumber').val();
        $('#typeNumber').change()
    })

$("#typeNumber").change(function() {
    const countRoom = $(this).val();
    $(".numberOfRooms").empty()
    for (let i = 1; i <= countRoom; i++) {
        $(".numberOfRooms").css("width", "100%").append(' <div class="col"><label class="label-align"></label>Room' + i + '<select id="roomTypeId" name="roomType" class="form-control"><optgroup label="Select a room type"><option selected>Choose an option</option><option/*[# th:each="r : ${T(com.example.onlinehotelbookingsystem.model.entity.enums.RoomTypeEnum).values()}" th:value="${r}" th:text="${r}"]*/>Single</option></option></optgroup></select></div>')
    }
});

/*]]>*/
</script>

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.