[86일차 - 1] 관리자_상품 수정 (페이지, 정보 읽어오기, 수정하기)

20221124(목)

• 목차
  - 상품 수정 페이지 
  - 상품 수정 정보 읽어오기
  - 상품 수정하기

---

< 상품 수정 페이지 >

• 처음부터 카테고리를 잘못등록해서 바꿔줘야 할 경우
• 이미지를 바꿔줘야 할 경우 등 상품 관련 정보를 수정해야 할 경우

1. AdProduct 컨트롤러 상품수정 페이지 코드추가

---

2. productList.jsp 코드추가

---

3. 매퍼는 이미 작업이 되어있으니 생략하고 컨트롤러에 코드 추가

---

4. productInsert.jsp 파일 복사 후 productModify.jsp 파일 생성

    - docmall에서 코드추가
    - 컨트롤러에 설정한 변수명과 일치여부 확인하기

• productModfy.jsp 추가코드
  - 카테고리 선택코드 설정

• productModfy.jsp 추가코드
  - 페이지 및 검색정보 & 버튼 value 값 연결

 

• 참고링크 ${표현언어}
  https://dorothy-yang.tistory.com/151

[69일차] 쿠키 / 표현언어 Expression Language : EL

---

< 상품 수정 정보 읽어오기 >

 

1. AdProduct 매퍼 코드추가

    - select문에는 resultType 필수로 가져옴

---

2. AdProduct 서비스 추가

---

3. AdProduct 컨트롤러에 수정상품정보 읽어오기 코드추가

 

ex) 실행화면

http://localhost:8000/admin/product/productModify?pageNum=1&amount=10&type=&keyword=&pdt_num=6&cate_code_prt=1&cate_code=12 (주소 대입 시)

 

---

< 상품 수정하기 - 이미지 변경 >

 

1. productModify.jsp 

    ** 기억하기 : 이미지 변경을 하지 않으면 그대로 업데이트

 <!--  날짜폴더, 상품이미지 파일명 -->
 <input type="hidden" id="pdt_img_folder" name="pdt_img_folder" value="${productVO.pdt_img_folder }">
 <input type="hidden" id="pdt_img" name="pdt_img" value="${productVO.pdt_img }">
 
 <!-- 상품이미지 보기 -->
<div class="form-group row">
<label for="pdt_img" class="col-sm-2 col-form-label">현재 이미지</label>
<div class="col-sm-4">
  <img src="/admin/product/displayFile?folderName=${productVO.pdt_img_folder }&fileName=${productVO.pdt_img }" id="cur_img" style="width: 200px;height: 200px;">
</div>
<label for="pdt_img" class="col-sm-2 col-form-label">변경 이미지</label>
<div class="col-sm-4">
  <img id="change_img" style="width: 200px;height: 200px;">
</div>
</div>

 

2. AdProduct 컨트롤러 상품수정하기 코드추가

---

3. AdProduct 컨트롤러와 FileUtils.java 파라미터 값 매칭 이해하기

---

4. FileUtils 코드추가

---

5. AdProduct 컨트롤러 코드추가

---

6. AdProduct 매퍼 코드추가

---

7. AdProduct 서비스 코드추가

---

8. AdProduct 컨트롤러 코드추가

 

---

< 상품정보 수정 실행화면 >

(1) 상품정보 수정하기

    - 파란 박스 안의 내용 바꿔보기

---

(2) 상품수정 버튼 클릭하면 뜨는 모달창

---

(3) 확인 버튼 클릭하면 나오는 List 창

    - 가격이 수정된 것은 확인 가능
    - 나머지는 DB에서 수정된거 확인하기(새고)

 

이전상태 정보
8 33 3 test 10000 10 도로시월드 test 2022\11\23 29457db1-3ff2-4213-8480-47e8be6f43c1_uh75s29y2xj6la6h4o87.jpg 1 Y 2022/11/23 12:46:12 2022/11/23 12:46:12

 

변경후 정보
8 12 1 test22 123456 5 도로시월드 수정했지롱 히히히ㅣㅎ 2022/11/23 29457db1-3ff2-4213-8480-47e8be6f43c1_uh75s29y2xj6la6h4o87.jpg 100 Y 2022/11/23 12:46:12 2022/11/24 12:26:31

---

(4) 이제 이미지를 바꿔보자!

---

(5) DB안의 이미지 파일명 바뀐것 확인하기!!!!

    - 변경전 파일명 : 29457db1-3ff2-4213-8480-47e8be6f43c1_uh75s29y2xj6la6h4o87.jpg

    - 변경후 파일명 : 69bd16e0-43d9-4324-b654-b5c4a99e0032_Bimg_20160830000343_wyqtgsxo.jpg

---

(6) goods 경로 내에 수정된 파일 잘 들어왔는지 확인하기

 

 

** ckeditor 안의 파일은 삭제되진 않는다! (참고하기)