英文:
Spring Boot & Thymeleaf,passing variables to the controller
问题
以下是您提供的内容的翻译部分：
控制器代码：
@PostMapping("/buyproduct")
public String buyProduct(@RequestParam int count, @RequestParam long id) {
Product product = productRepository.findById(id);
int activeCount = product.getCount();
if (activeCount - count < 0) {
return "redirect:/";
}
product.setCount(activeCount -= count);
productRepository.save(product);
return "redirect:/buyproductsuccessful";
}
HTML代码：
<div class="col-12 col-md-6 col-lg-4" th:each="element : ${products}">
<div class="card">
<img class="card-img-top" src="https://picsum.photos/362/180" alt="Card image cap">
<div class="card-body">
<h5 style="text-align: center" class="card-title" th:text="${element.getName()}"></h5>
<span th:text="${element.getCost()}"></span>
<span th:text="${element.getCount()}"></span>
...
</div>
</div>
<form action="#" th:action="@{/buyproduct}" th:object="${element}" method="post">
<!-- Modal Header -->
<div class="modal-header">
<h4 class="modal-title" style="color: #368819"></h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- Modal body -->
<div class="modal-body">
<div>
<input type="hidden" name="id" th:value="*{getId()}">
<label><b>数量</b></label><br>
<input class="col-4" type="number" min="1" value="1" name="count" required><br><br>
<label><b></b></label><br>
<input class="col-12" type="text"><br><br>
<label><b></b></label><br>
<input class="col-12" type="date"><br><br>
<label><b>CVV/CVC</b></label><br>
<input class="col-4" type="text"><br><br>
</div>
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="submit" class="btn btn-success"></button>
<button type="button" class="btn btn-danger" data-dismiss="modal"></button>
</div>
</form>
</div>
请注意，翻译中的代码可能会存在格式不一致或错误。如果您需要准确的代码翻译，请在实际工作中进行验证。
英文:
I have a controller that processes the purchase of a product,it takes two parameters,count - the quantity of the product and id - the ID of the product that the user buys.
@PostMapping("/buyproduct")
public String buyProduct(@RequestParam int count,@RequestParam long id){
Product product = productRepository.findById(id);
int activeCount = product.getCount();
if (activeCount-count<0){
return "redirect:/";
}
product.setCount(activeCount-=count);
productRepository.save(product);
return "redirect:/buyproductsuccessful";
}
In index.html I have listed all available products in the database using Thymeleaf.
<div class="col-12 col-md-6 col-lg-4" th:each="element : ${products}">
<div class="card">
<img class="card-img-top" src="https://picsum.photos/362/180" alt="Card image cap">
<div class="card-body">
<h5 style="text-align: center" class="card-title" th:text="${element.getName()}"</h5>
<span th:text="${element.getCost()}"></span></p>
<span th:text="${element.getCount()}"></span> </p>
...
Each product has its own button,when clicked, a popup opens in which you need to enter the quantity of the purchased product and Bank data (I don't process them, I don't Need them yet), and there is also a hidden field in which I want to put the product ID so that it can be passed to the controller later.
<form action="#" th:action="@{/buyproduct}" th:object="${element}" method="post">
<!-- Modal Header -->
<div class="modal-header">
<h4 class="modal-title" style="color: #368819"></h4>
<button type="button" class="close" data-dismiss="modal">&times;</button>
</div>
<!-- Modal body -->
<div class="modal-body">
<div>
<input type="hidden" name="id" th:value="*{getId()}">
<label><b>რაოდენობა</b></label><br>
<input class="col-4" type="number" min="1" value="1" name="count" required><br><br>
<label><b></b></label><br>
<input class="col-12" type="text"><br><br>
<label><b></b></label><br>
<input class="col-12" type="date"><br><br>
<label><b>CVV/CVC</b></label><br>
<input class="col-4" type="text"><br><br>
</div>
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="submit" class="btn btn-success"></button>
<button type="button" class="btn btn-danger" data-dismiss="modal"></button>
</div>
</form>
But Thymeleaf passes the id of the first product every time,what is my mistake?
答案1
得分: 0
问题出在 Bootstrap 模态框作用域上。
<button style="margin-left: 40%" type="button" class="btn btn-success" data-toggle="modal" data-target="#myModal">
<div class="modal" id="myModal">
修复后的代码如下。
<button style="margin-left: 40%" type="button" class="btn btn-success" data-toggle="modal" th:attr="data-target=''#id-' + ${element.getId()}'">
<div class="modal" th:id="'id-' + ${element.getId()}">
英文:
The problem was with Bootstrap modal scopes.
<button style="margin-left: 40%" type="button" class="btn btn-success" data-toggle="modal" data-target="#myModal">
<div class="modal" id="myModal">
After fix its looks like this.
<button style="margin-left: 40%" type="button" class="btn btn-success" data-toggle="modal" th:attr="data-target='#id-' + ${element.getId()}">
<div class="modal" th:id="'id-' + ${element.getId()}">
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论