I get this error:
An error happened during template parsing (template: "class path resource [templates/update-customer.html]")
org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates/update-customer.html]")
I can not be redirected to my update-customer.html
because of this problem.
list.html
:
<td>
<a th:href="@{'/customers/form-update-customer/' + ${customer.id}}" class="btn btn-primary btn-sm">Update</a>
</td>
CustomerController.java
:
@Controller
@RequestMapping("/customers")
public class CustomerController {
private CustomerService customerService;
public CustomerController(CustomerService theCustomerService){
customerService = theCustomerService;
}
@GetMapping("/form-update-customer/{id}")
public String formUpdateCustomer(@PathVariable("id") int id, Model model) {
CustomerModel customerModel = customerService.read(id);
model.addAttribute("customer", customerModel);
return "update-customer";
}
}
update-customer.html
<!doctype html>
<html lang="en" xmlns:th="http://thymeleaf.org">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" th:href="@{/assets/bootstrap-5.3.3.min.css}">
<script th:src="@{/assets/bootstrap-5.3.3.min.js}"></script>
<script th:src="@{/assets/jquery-3.7.1.min.js}"></script>
<script th:src="@{/assets/mask.js}"></script>
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Update Customer</title>
</head>
<body>
<form th:action="@{'/customers/update-customer/' + *{id}}" method="POST">
<input type="hidden" th:field="*{id}">
<input type="text" th:field="*{name}" class="form-control mb-4 w-25" placeholder="Input the name"/>
<div th:if="${#fields.hasErrors('name')}" th:errors="*{name}" class="text-danger"></div>
<button type="submit" class="btn btn-info col-2">Update</button>
</form>
</body>
</html>
I guess that Update
button is right, return me localhost:8080/customers/form-update-customer/8
.
The form tag in update-customer.html
should be either:
<form th:action="@{'/customers/update-customer/' + ${customer.id}}"
th:object="${customer}" method="POST">
or
<form th:action="@{/customers/update-customer/{id}(id = ${customer.id})}"
th:object="${customer}" method="POST">
Both are valid. The crucial point is th:object="${customer}"
where you bind the model variable customer
, added in the controller, to the form data object model (DOM). After doing it, you can access the object properties like this:
${customer.id}
or
*{name}