更新”电影”数据时出现问题,使用Thymeleaf和Spring。

huangapple go评论46阅读模式
英文:

Problem with updating "movie" data using Thymeleaf and spring

问题

以下是您提供的代码的翻译:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <form th:object="${movieToUpdate}" method="post">
        <p>电影名称: <input type="text" th:field="*{name}"></p>
        <p>电影描述: <input type="text" th:field="*{description}"></p>
        <img th:src="${movieToUpdate.getImageUrl()}" th:width="300" th:height="300"><br>
        <p>新图片链接: <input type="text" th:field="*{imageUrl}" class="cloudinary-fileupload"></p>

        <a th:href="${'/movie/update/'+movieToUpdate.getId()}">更新</a><br>
    </form>

</body>
</html>
package pl.fsaaa.filmapp.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;
import pl.fsaaa.filmapp.model.Movie;
import pl.fsaaa.filmapp.service.CloudinaryImageUploader;
import pl.fsaaa.filmapp.service.MovieService;

import java.io.IOException;
import java.util.List;

@Controller
public class MovieController {

    private CloudinaryImageUploader cloudinaryImageUploader;
    private MovieService movieService;

    @Autowired
    public MovieController(MovieService movieService, CloudinaryImageUploader cloudinaryImageUploader) {
        this.movieService = movieService;
        this.cloudinaryImageUploader = cloudinaryImageUploader;
    }

    @GetMapping("/addmovie")
    public String getNewMovie(Model model) {
        model.addAttribute("newMovie", new Movie());
        return "addMoviePage";
    }

    @PostMapping("/add-movie")
    public String addMovie(@ModelAttribute Movie movie) throws IOException {
        cloudinaryImageUploader.saveImageToCloudinary(movie.getImageUrl());
        movie.setImageUrl(cloudinaryImageUploader.getCloudinaryImageUrl());
        movieService.addMovie(movie);
        return "redirect:/addmovie";
    }

    @GetMapping("/movies")
    public String getAllMovies(Model model) {
        List<Movie> movieList = movieService.getAllMovies();
        model.addAttribute("allMovies", movieList);
        return "moviesPage";
    }

    @GetMapping("/movie/{id}")
    public String getMovieDetail(Model model, @PathVariable Long id) {
        Movie movieToUpdate = movieService.getMovieById(id);
        model.addAttribute("movieToUpdate", movieToUpdate);
        return "movieDetailsPage";
    }

    @RequestMapping(value = "/movie/update/{id}", method = {RequestMethod.GET, RequestMethod.PUT})
    public String updateMovie(@PathVariable Long id, @ModelAttribute Movie movieToUpdate){
        movieService.addMovie(movieToUpdate);
        return "redirect:/movies";
    }

    @RequestMapping(value = "/movie/delete/{id}", method = {RequestMethod.DELETE, RequestMethod.GET})
    public String deleteMovie(@PathVariable Long id){
        movieService.deleteMovie(id);
        return "redirect:/movies";
    }
}

请注意,我已经将HTML和Java代码中的特殊字符进行了恢复,以使其可读。如果您需要进一步的帮助或有任何问题,请随时提出。

英文:

Hey I've got a problem with updating my object. I've got a table of movies where can i delete it or go to details. In details i wanted to have my "update" option. Im giving whole object to movieDetailPage, it shows object details in input fields but i cant update it. My "updateMovie" method doesnt see what i typed in input. For example im changing name from "Movie1" to "Movie2" and method still see "Movie1"

Here's my movieDetailsPage.html

&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;en&quot; xmlns:th=&quot;http://www.thymeleaf.org&quot;&gt;
&lt;head&gt;
&lt;meta charset=&quot;UTF-8&quot;&gt;
&lt;title&gt;Title&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;form  th:object=&quot;${movieToUpdate}&quot; method=post &gt;
&lt;p&gt;Movie name: &lt;input type=&quot;text&quot; th:field=&quot;*{name}&quot;&gt;&lt;/p&gt;
&lt;p&gt;Movie description: &lt;input type=&quot;text&quot; th:field=&quot;*{description}&quot;&gt;&lt;/p&gt;
&lt;img th:src=&quot;${movieToUpdate.getImageUrl()}&quot; th:width=&quot;300&quot; th:height=&quot;300&quot;&gt;&lt;br&gt;
&lt;p&gt;Nowy image url: &lt;input type=&quot;text&quot; th:field=&quot;*{imageUrl}&quot; class=&quot;cloudinary-fileupload&quot;&gt;&lt;/p&gt;
&lt;a th:href=&quot;${&#39;/movie/update/&#39;+movieToUpdate.getId()}&quot;&gt;Update&lt;/a&gt;&lt;br&gt;
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;

and my controller class

package pl.fsaaa.filmapp.controller;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;
import pl.fsaaa.filmapp.model.Movie;
import pl.fsaaa.filmapp.service.CloudinaryImageUploader;
import pl.fsaaa.filmapp.service.MovieService;
import java.io.IOException;
import java.util.List;
@Controller
public class MovieController {
private CloudinaryImageUploader cloudinaryImageUploader;
private MovieService movieService;
@Autowired
public MovieController(MovieService movieService, CloudinaryImageUploader cloudinaryImageUploader) {
this.movieService = movieService;
this.cloudinaryImageUploader = cloudinaryImageUploader;
}
@GetMapping(&quot;/addmovie&quot;)
public String getNewMovie(Model model) {
model.addAttribute(&quot;newMovie&quot;,new Movie());
//        model.addAttribute(&quot;newImage&quot;,new File(&quot;&quot;));
return &quot;addMoviePage&quot;;
}
@PostMapping(&quot;/add-movie&quot;)
public String addMovie(@ModelAttribute Movie movie) throws IOException {
cloudinaryImageUploader.saveImageToCloudinary(movie.getImageUrl());
movie.setImageUrl(cloudinaryImageUploader.getCloudinaryImageUrl());
movieService.addMovie(movie);
return &quot;redirect:/addmovie&quot;;
}
@GetMapping(&quot;/movies&quot;)
public String getAllMovies(Model model) {
List&lt;Movie&gt; movieList = movieService.getAllMovies();
model.addAttribute(&quot;allMovies&quot;,movieList);
return &quot;moviesPage&quot;;
}
@GetMapping(&quot;/movie/{id}&quot;)
public String getMovieDetail(Model model, @PathVariable Long id) {
Movie movieToUpdate = movieService.getMovieById(id);
System.out.println(movieToUpdate);
model.addAttribute(&quot;movieToUpdate&quot;, movieToUpdate);
return &quot;movieDetailsPage&quot;;
}
@RequestMapping(value = &quot;/movie/update/{id}&quot;, method = {RequestMethod.GET,RequestMethod.PUT})
//    @PutMapping(&quot;movie/update/{id}&quot;)
public String updateMovie(@PathVariable Long id, @ModelAttribute Movie movieToUpdate){
//        movieToUpdate = movieService.getMovieById(id);
//        System.out.println(movieToUpdate);
movieService.addMovie(movieToUpdate);
return &quot;redirect:/movies&quot;;
}
@RequestMapping(value = &quot;/movie/delete/{id}&quot;, method = {RequestMethod.DELETE,RequestMethod.GET})
public String deleteMovie(@PathVariable Long id){
movieService.deleteMovie(id);
return &quot;redirect:/movies&quot;;
}
}

答案1

得分: 0

问题已解决。
我已将提交按钮添加到详细页面,而不是链接:

<form th:action="'/movies/update/'+*{id}" th:object="${movieToUpdate}" method="put">
    <p>电影名称:<input type="text" th:field="*{name}"></p>
    <p>电影描述:<input type="text" th:field="*{description}"></p>
    <img th:src="${movieToUpdate.getImageUrl()}" th:width="300" th:height="300"><br>
    <p>新图片链接:<input type="text" th:field="*{imageUrl}" class="cloudinary-fileupload"></p>
    <p><input type="submit" value="更新"></p>
</form>

并且稍微更改了编辑 "movie" 方法,因为之前的方法未将更改后的图像上传到 Cloudinary。

@RequestMapping(value = "/update/{id}", method = {RequestMethod.GET, RequestMethod.PUT})
public String updateMovie(@PathVariable Long id, @ModelAttribute Movie movieToUpdate) throws IOException {
    movieToUpdate.setId(id);
    cloudinaryImageUploader.saveImageToCloudinary(movieToUpdate.getImageUrl());
    movieToUpdate.setImageUrl(cloudinaryImageUploader.getCloudinaryImageUrl());
    movieService.addMovie(movieToUpdate);
    return "redirect:/movies/all";
}
英文:

Problem solved.
I've added submit button to details page instead of link:

  &lt;form th:action=&quot;&#39;/movies/update/&#39;+*{id}&quot; th:object=&quot;${movieToUpdate}&quot; method=put &gt;
&lt;p&gt;Movie name: &lt;input type=&quot;text&quot; th:field=&quot;*{name}&quot;&gt;&lt;/p&gt;
&lt;p&gt;Movie description: &lt;input type=&quot;text&quot; th:field=&quot;*{description}&quot;&gt;&lt;/p&gt;
&lt;img th:src=&quot;${movieToUpdate.getImageUrl()}&quot; th:width=&quot;300&quot; th:height=&quot;300&quot;&gt;&lt;br&gt;
&lt;p&gt;New image url: &lt;input type=&quot;text&quot; th:field=&quot;*{imageUrl}&quot; class=&quot;cloudinary-fileupload&quot;&gt;&lt;/p&gt;
&lt;p&gt;&lt;input type=&quot;submit&quot; value=&quot;Update&quot;&gt;&lt;/p&gt;
&lt;/form&gt;

and changed update edited "movie" method a little bit, because previous one wasn't uploading changed image to cloudinary.

    @RequestMapping(value = &quot;/update/{id}&quot;, method = {RequestMethod.GET,RequestMethod.PUT})
public String updateMovie(@PathVariable Long id, @ModelAttribute Movie movieToUpdate) throws IOException {
movieToUpdate.setId(id);
cloudinaryImageUploader.saveImageToCloudinary(movieToUpdate.getImageUrl());
movieToUpdate.setImageUrl(cloudinaryImageUploader.getCloudinaryImageUrl());
movieService.addMovie(movieToUpdate);
return &quot;redirect:/movies/all&quot;;
}

huangapple
  • 本文由 发表于 2020年7月22日 23:01:52
  • 转载请务必保留本文链接:https://go.coder-hub.com/63037319.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定