본문 바로가기
Spring Tutorial

[스프링MVC -상품 관리 웹 개발 6] 상품 수정

by 미소5 2023. 9. 1.
  • 컨트롤러 로직 추가
/** 상품 수정 폼 컨트롤러 */
@GetMapping("/{itemId}/edit")
public String editForm(@PathVariable Long itemId, Model model) {
    Item item = itemRepository.findById(itemId);    //수정에 필요한 정보 조회
    model.addAttribute("item", item);
    return "basic/editForm";    //수정용 폼 뷰를 호출
}

 


  • 뷰 템플릿(templates)
    • /resources/templates/basic/editForm.html
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
 <meta charset="utf-8">
 <link href="../css/bootstrap.min.css"
 th:href="@{/css/bootstrap.min.css}" rel="stylesheet">
 <style>
 .container {
 max-width: 560px;
 }
 </style>
</head>
<body>

<div class="container">

 <div class="py-5 text-center">
 <h2>상품 수정 폼</h2>
 </div>
 
 <form action="item.html" th:action method="post">
 <div>
 <label for="id">상품 ID</label>
 <input type="text" id="id" name="id" class="form-control" value="1" th:value="${item.id}" readonly>
 </div>
 <div>
 <label for="itemName">상품명</label>
 <input type="text" id="itemName" name="itemName" class="formcontrol" value="상품A" th:value="${item.itemName}">
 </div>
 <div>
 <label for="price">가격</label>
 <input type="text" id="price" name="price" class="form-control" th:value="${item.price}">
 </div>
 <div>
 <label for="quantity">수량</label>
 <input type="text" id="quantity" name="quantity" class="formcontrol" th:value="${item.quantity}">
 </div>
 
 <hr class="my-4">
 
 <div class="row">
 <div class="col">
 <button class="w-100 btn btn-primary btn-lg" type="submit">저장</button>
 </div>
 
 <div class="col">
 <button class="w-100 btn btn-secondary btn-lg"
onclick="location.href='item.html'"
 th:onclick="|location.href='@{/basic/items/{itemId}(itemId=${item.id})}'|"
 type="button">취소</button>
 </div>
 
 </div>
 
 </form>
 
</div> <!-- /container -->
</body>
</html>

 


  • 컨트롤러 로직 추가
/** 상품 수정 처리*/
@PostMapping("/{itemId}/edit")
public String edit(@PathVariable Long itemId, @ModelAttribute Item item) {
    itemRepository.update(itemId, item);
    return "redirect:/basic/items/{itemId}";    //리다이렉트 호출 (상품상세화면으로 이동)
}
  • redirect:/basic/items/{itemId}    //뷰 템플릿을 호출하는 대신에, 리다이렉트를 호출
    • 스프링은  redirect:/... 으로 편리하게 리다이렉트를 지원한다. 
    • 컨트롤러에 매핑된 @PathVariable의 값을 redirect에도 사용할 수 있다.
      • {itemId}는  @PathVariable Long itemId 의 값을 그대로 사용

 



  • 상품 등록과 전체 프로세스가 유사하다.
    • 상품 수정 폼: GET /items/{itemId}/edit 
    • 상품 수정 처리: POST /items/{itemId}/edit

 

 

[스프링MVC 상품 관리 웹 페이지 4] 상품 등록 폼 (tistory.com)

 

[스프링MVC 상품 관리 웹 페이지 4] 상품 등록 폼

컨트롤러 로직 추가 /** 상품 등록 폼*/ @GetMapping("/add") public String addForm() { return "basic/addForm"; //단순히 뷰 템플릿만 호출 } 뷰 템플릿(templates) /resources/templates/basic/addForm.html 상품 등록 폼 상품 입력

joly156.tistory.com

 


  • HTML Form 전송은 PUT, PATCH를 지원하지 않는다. GET, POST만 사용할 수 있다.
    • PUT, PATCH는 HTTP API 전송시에 사용
    • 스프링에서 HTTP POST로 Form 요청할 때 히든 필드를 통해서 PUT, PATCH 매핑을 사용하는 방법이 있지만, HTTP 요청상 POST 요청이다.

 

728x90
반응형