Есть две потенциальные проблемы, которые я заметил в этом примере:
1) dailySaleHistoryDto.productList
Как вы упоминаете в своем вопросе, это может быть проблемой (или может и не быть) ). Если productList на самом деле является Java List объектом, то вы можете не получить ожидаемых результатов - Thymeleaf преобразует это в строку в вашем шаблоне. Если объект представляет собой список строк, то вы получите нечто, похожее на строковое представление массива:
[item1, item2, ...]
Это может быть или не быть проблемой - это зависит от того, что вам нужно делать с данными. Например, вы можете преобразовать его обратно из строки в массив в JavaScript.
2) "onclick" JavaScript
Вам нужно будет использовать [[...]] * Thymeleaf's 1014 * встроенная запись для встраивания переменных Thymeleaf в JavaScript. Я бы порекомендовал переместить JavaScript в отдельный раздел - например, в заголовок вашего документа. Итак, что-то вроде этого:
<head>
...
<script th:inline="javascript">
function addProductFields() {
var status = [[${status.index}]];
var status1 = [[${status1.index}]];
var dailySaleHistoryDto = [[${dailySaleHistoryDto.productList}]];
// show that it worked - print the values to the browser console:
console.log(status);
console.log(status1);
console.log(dailySaleHistoryDto);
// whatever logic you need goes here...
}
</script>
</head>
Затем вы можете упростить свою кнопку до этого:
<button type="button" onclick="addProductFields();" class="btn btn-info"> +</button>
Обратите внимание, что вам больше не нужно использовать th:onclick - просто onclick , Вы переместили все переменные в отдельный скрипт (в этом примере).
Это может не дать вам полного пути к полному решению из-за пункта (1), но это должно помочь.