如何将 html 输入保存到列表中并在每次提交时显示？

Question

我目前有上图所示的内容。我可以在文本框中输入文本，然后单击提交，将其发布在结果下。如何编写一个不会覆盖先前消息的脚本？例如;当我输入另一封电子邮件并点击提交时，它应该显示在 Hello@gmail.com 下面而不是覆盖它。此外，当用户单击提交时，我如何将他们的回复保存在与页面上显示的内容相对应的列表中？如果文本被删除，它也应该从 java 列表中删除。

控制器

@Controller
public class EmailController {
    @GetMapping("/editprop")
    public String greetingForm(Model model) {
        model.addAttribute("greeting", new Greeting());
        return "editprop";
    }

    @PostMapping("/editprop")
    public String greetingSubmit(@ModelAttribute Greeting greeting) {
        System.out.println(greeting.getEmail() + "@@@@@@@@");      
        return "editprop";
    }
}

editprop thymeleaf

<h1>Form</h1>
    <form action="#" th:action="@{/editprop}" th:object="${greeting}" method="post">
        <p>Email: <input type="text" th:field="*{email}" /></p>
        <p><input type="submit" value="Submit" /> <input type="reset" value="Reset" /></p>
    </form>



<h1>Result</h1>
<p th:text="'Email: ' + ${greeting.email}" />
<a href="/greeting">Submit another message</a>

波乔

public class Greeting {

private String email;
//getter and setters

尝试

为了不覆盖前面的文本，我决定创建一个表并使用 th:foreach iterStat: 来显示列表中的每个值。所以，我真正的问题是如何在每次单击 sumbit 时将值保存到列表中？

Answer 1

• 创建一个列表并将其放入会话中。
• 提交时，将用户提供的值添加到列表中。
• 在页面上，遍历列表项并显示它们。

将电子邮件添加到会话对象：

public String greetingSubmit(@ModelAttribute Greeting greeting, HttpSession session) {
  List<String> emails = (List<String>) session.getAttribute("emails");
  if (emails == null) {
    session.setAttribute("emails", emails = new ArrayList<String>());
  }

  emails.add(greeting.getEmail());

遍历电子邮件：

<h1>Result</h1>
<th:block th:if="${session.emails NE null}">
  <p th:each="email: ${session.emails}" th:text="'Email: ' + ${email}" />
</th:block>

在实际应用程序中，您可能会将电子邮件存储在数据库中，而不是使用这样的会话。