如何使用 Thymeleaf 将元素添加到集合答案

【问题标题】：How add element to collection using Thymeleaf如何使用 Thymeleaf 将元素添加到集合
【发布时间】：2017-01-03 22:12:11
【问题描述】：

在我的 Spring/Thymeleaf/Hibernate 项目中，我需要能够将元素添加到我的编辑对象的字段（即 List）。我是怎么做到的，因为不允许嵌入？类似的东西：

@Entity
public class Recipe {
    @Id
    private int id;

    private String name;
    private String description;
    private List<String> steps;
}

还有我的百里香模板：

<form th:action="@{|/save/${recipe.id}|}" method="post" th:object="${recipe}">

<input type="hidden" th:field="${recipe.id}" th:value="${recipe.id}"/>
<input type="text" th:field="${recipe.name}" th:value="${recipe.name}"/>
<input type="text" th:field="${recipe.description}" th:value="${recipe.description}"/>

<input th:each="step : ${recipe.steps}" type="text" th:field="${step}" th:value="${step}"/>

<!-- And here I want make ability add new step element to List<String> steps -->

如何制作，而不丢失已编辑的Recipe对象数据？使用<form> 和<button type="submit"> 添加？还是只使用<a href>？那么如何不丢失输入的数据呢？

【问题讨论】：

标签： java html spring thymeleaf

【解决方案1】：

嗯，找到了解决方案，当然不理想，但它确实有效。向我的班级添加了字段（它将是标志，我们应该在 form-action-url 的端点中做什么：将步骤添加到列表并重定向以再次编辑或只是保存。表单有 2 个提交按钮：和，将标志字段更改为JavaScrypt的“步骤”，所以我会知道我已经将元素添加到List并重定向回来。 JavaScrypt：

<script type="text/javascript">
    function toggleAddedStep()
    {
        document.getElementById("recipeAddedFlag").value = "step";
    }
    function toggleAddedNothing()
    {
        document.getElementById("recipeAddedFlag").value = "";
    }
</script>

【讨论】：