Home > Back-end >  Can not edit data from database via thymeleaf and spring
Can not edit data from database via thymeleaf and spring

Time:07-18

I want to edit data from database via form "bookUpdate.html", that I can open from page "bookList.html" with the list of all rows from the table. I created a controller and form, that redirect me to the page with filled fields, that contain right data according the value "id", where object = "book". Button "Edit" redirect me to the page "/bookUpdate/1?", it is right. But when I try to confirm a new information via button on this page, this action redirect me to "bookUpdate.html" with an error 404, and new data were not saved in database. I can not find a mistake in this case.

bookUpdate.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
xmlns:sec="https://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
layout:decorate="~{fragments/main_layout}">
<head>
<title>Book Form</title>
</head>
<body>
<div layout:fragment="content" >

    <form th:action="@{/bookUpdate}" th:object="${book}" method="post">
        <div >
            <label for="topic" >Topic</label> <input
                type="text"  th:value="${book.topic}"
                id="topic" />
        </div>

        <div >
            <label for="description" >Description</label>
            <textarea  th:value="${book.description}"
                id="description" style="height: 95px"></textarea>
        </div>

        <div >
            <label for="link" >Link</label> <input
                type="text"  th:value="${book.link}" id="link" />
        </div>

        <input type="submit" value="Submit"  />
    </form>
</div>
</body>
</html>  

Contoller

@Controller
public class BookUpdateController {

@Autowired
private BookService service;

 @PostMapping("/bookUpdate/{id}")
public String editBook(@Valid BookDto book, @PathVariable (value = "id") Integer id, Model 
model) {
    Book oldBook = service.findById(id);
    oldBook.setDescription(book.getDescription());
    oldBook.setTopic(book.getTopic());
    oldBook.setLink(book.getLink());
    service.saveBook(oldBook);
    model.addAttribute("book", new BookDto());
    return "redirect:/bookList";
} 
}

@GetMapping("/bookUpdate/{id}")
public String bookListUpdate(@PathVariable (value = "id") Integer id, Model model) {
    model.addAttribute("book", service.findById(id));
    return "views/bookUpdate";
} 

bookList.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
xmlns:sec="https://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
layout:decorate="~{fragments/main_layout}">
<head>
<title>Books</title>
</head>
<body>

<div layout:fragment="content" >
    <form action="/bookList" >
        <div  >
            <input type="text"  name="name"
                placeholder="Search book" /> <input type="submit" value="Search"
                 />
        </div>
    </form>
    <div >
        <div >
            <ul th:each="books:${book}" style="list-style: none; padding-left: 10px;">
                <li><b>Topic:</b> <span th:text="${books.topic}"></span></li>
                <li><b>Description:</b><p th:text="${books.description}"></p></li>
                <li><b>Link:</b> <span th:text="${books.link}"></span></li>
                <br>
                 <form  
th:action="@{'/bookUpdate/' ${books.id}}" th:object="${books}" method="get">
                    <input  type="hidden" />
                    <button  type="submit" 
>Edit</button>
                </form> 
                <hr>
            </ul>
        </div>
    </div>
</div>
</body>
</html>

CodePudding user response:

In your bookUpdate.html file, the action property is not set correctly. Your form after posting send information to @{/bookUpdate} but in related controller, defined PostMapping required @PostMapping("/bookUpdate/{id}") and they are mismach.

Change your form action property to :

<form th:action="@{'/bookUpdate/' ${book.id}}" th:object="${book}" method="post">
  • Related