我是spring新手,我正在尝试使用springmvc和thymeleaf来创建web应用程序。我有一个与表单页创建自定义比萨饼和相应的控制器。用户可以输入比萨饼的名称,所以我添加了输入验证。在输入无效名称之前,一切正常,但是当我返回页面的新视图时,带有复选框的div不会出现,它们只是不会生成。似乎我的模型刷新后是空的,但我不明白我怎么可以调试这个,我的捷径在intellij想法只是不工作。
CreatePizza控制器:
@Slf4j
@Controller
@RequestMapping("/create")
public class CreatePizzaController {
@GetMapping
public String showCreationForm(Model model){
List<Ingredient> ingredients = Arrays.asList(
new Ingredient("CLS22", "Classic base 22cm", Ingredient.Type.BASIC),
new Ingredient("CLS30", "Classic base 30cm", Ingredient.Type.BASIC),
new Ingredient("PEPE", "Pepperoni", Ingredient.Type.MEAT),
new Ingredient("HAM", "Ham", Ingredient.Type.MEAT),
new Ingredient("CHMPG", "Champignons", Ingredient.Type.VEGGIES),
new Ingredient("CUCU", "Cucumbers", Ingredient.Type.VEGGIES),
new Ingredient("PARM", "Parmesan cheese", Ingredient.Type.CHEESE),
new Ingredient("MOZ", "Mozzarella cheese", Ingredient.Type.CHEESE),
new Ingredient("BARBS", "Barbecue sauce", Ingredient.Type.SAUCE),
new Ingredient("TOMAS", "Tomato sauce", Ingredient.Type.SAUCE)
);
Ingredient.Type[] types = Ingredient.Type.values();
for(Ingredient.Type type: types){
model.addAttribute(type.toString().toLowerCase(), filterByType(ingredients, type));
}
model.addAttribute("create", new Pizza());
return "create";
}
@PostMapping
public String processCreation(@Valid @ModelAttribute("create") Pizza pizza, BindingResult result){
if(result.hasErrors()){
return "create";
}
//Save creation...
log.info("Processing creation: " + pizza);
return "redirect:/orders/current";
}
private List<Ingredient> filterByType(List<Ingredient> ingredients, Ingredient.Type type) {
List<Ingredient> filtered = new ArrayList<>();
for (Ingredient ingredient:ingredients){
if(ingredient.getType() == type){
filtered.add(ingredient);
}
}
return filtered;
}
}
创建.html:
<!DOCTYPE html>
<html lang="en">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" th:href="@{/styles/style.css}" />
</head>
<body>
<h3>Create your pizza:</h3>
<img th:src="@{/images/pizza_logo.jpg}" width="200" height="200"/>
<form method="post" th:object="${create}">
<div class="grid">
<div class="ingredient-group" id="basics">
<h3>Choose the basic: </h3>
<div th:each="ingredient : ${basic}">
<input name="ingredients" type="radio" checked th:value="${ingredient.id}"/>
<span class="checktext" th:text="${ingredient.name}">INGREDIENT</span><br/>
</div>
</div>
<div class="ingredient-group" id="meat">
<h3>Choose meat: </h3>
<div th:each="ingredient : ${meat}">
<input name="ingredients" type="checkbox" th:value="${ingredient.id}"/>
<span class="checktext" th:text="${ingredient.name}">INGREDIENT</span><br/>
</div>
</div>
<div class="ingredient-group" id="veggies">
<h3>Choose vegetables: </h3>
<div th:each="ingredient : ${veggies}">
<input name="ingredients" type="checkbox" th:value="${ingredient.id}"/>
<span class="checktext" th:text="${ingredient.name}">INGREDIENT</span><br/>
</div>
</div>
<div class="ingredient-group" id="sauce">
<h3>Choose sauce: </h3>
<div th:each="ingredient : ${sauce}">
<input name="ingredients" type="checkbox" th:value="${ingredient.id}"/>
<span class="checktext" th:text="${ingredient.name}">INGREDIENT</span><br/>
</div>
</div>
<div class="ingredient-group" id="cheese">
<h3>Choose cheese: </h3>
<div th:each="ingredient : ${cheese}">
<input name="ingredients" type="checkbox" th:value="${ingredient.id}"/>
<span class="checktext" th:text="${ingredient.name}">INGREDIENT</span><br/>
</div>
</div>
</div>
<div class="submit-button">
<h3>Name your pizza:</h3>
<input class="submit-field" type="text" th:field="*{name}" />
<span class="validationError"
th:if="${#fields.hasErrors('name')}"
th:errors="*{name}">Error</span>
<br/>
<button>Submit your pizza</button>
</div>
</form>
</body>
</html>
无效输入前的页面
无效输入后的pafe
github上的完整代码
1条答案
按热度按时间z4iuyo4d1#
你的问题是:
在返回“create”之前,需要再次添加模型属性。thymeleaf并没有错,模型只是缺少属性,无法填充复选框。这样的方法应该有用: