使用ThymeLeaf创建多个文本输入框



我希望电子邮件、电话号码和服务提供商这三个属性中的每一个都有四个文本输入框。每个输入都应该存储在不同的ArrayList对象的电子邮件、电话号码和服务提供商属性中。

我认为每个都将使用

这是我的代码:

这是我的控制器端点方法:

@GetMapping("/")
public String formMethod(Model model) {
ArrayList<User> users = new ArrayList<>(4);
model.addAttribute("users", users);
return "communicationForm";
}

这是我的用户类:

public class User {
String email;
String phoneNumber;
String serviceProvider;
String emailSubject;
String emailMessage;
String textSubject;
String textMessage;
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
public String getPhoneNumber() {
return phoneNumber;
}
public void setPhoneNumber(String phoneNumber) {
this.phoneNumber = phoneNumber;
}
public String getServiceProvider() {
return serviceProvider;
}
public void setServiceProvider(String serviceProvider) {
this.serviceProvider = serviceProvider;
}
public String getEmailSubject() {
return emailSubject;
}
public void setEmailSubject(String emailSubject) {
this.emailSubject = emailSubject;
}
public String getEmailMessage() {
return emailMessage;
}
public void setEmailMessage(String emailMessage) {
this.emailMessage = emailMessage;
}
public String getTextSubject() {
return textSubject;
}
public void setTextSubject(String textSubject) {
this.textSubject = textSubject;
}
public String getTextMessage() {
return textMessage;
}
public void setTextMessage(String textMessage) {
this.textMessage = textMessage;
}
}

这是我的communicationForm.html文件

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>OverStay LLC</title>
</head>
<body>
<h2>Submit the email address or phone number. If the service provider is known, include it. If not, the program can find out.</h2>
<h3>Enter the service providers like so: T-Mobile, Verizon, AT&T, Visible, Mint Mobile, Metro, Xfinity Mobile. ONLY enter them if you know which one it is</h3>
<br>
<form action="#" th:action="@{/sendMessage}" th:object="${users}" method="post">
<th:block th:each="user : ${users}">
<p>
Email:
<input type="text" th:value="${user.email}" />
</p>
</br></br>
</th:block>
<br>
<th:block th:each="user : ${users}">
Phone Number (Do NOT include a 1 as the first number):
<input type="text" th:value="${user.phoneNumber}" />
</br></br>
</th:block>
<br>
<th:block th:each="user : ${users}">
Service Provider:
<input type="text" th:value="${user.email}" />
</br></br>
</th:block>
</br></br>
<input type="submit" value="Submit"/> <input type="reset" value="Reset">
</form>
</body>
</html>

Thymeef不将List/ArrayList作为支持对象处理。。。因此,您必须创建另一个对象来容纳用户。

public class UserForm {
private List<User> users;
// getters and setters
}

对于model.addAttribute("form", userForm);,典型的形式如下:

<form action="#" th:action="@{/sendMessage}" th:object="${form}" method="post">
<th:block th:each="user, status: ${form.users}">
<p>
Email:
<input type="text" th:field="*{users[__${status.index}__].email}" />
</p>
</br>
</br>
</th:block>

控制器的方法看起来像:

@PostMapping("/sendMessage")
public String save(@ModelAttribute("form") UserForm form) {

最新更新