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

🏫 Open API_JAVA

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

Dorothy_YANG 2022. 11. 24. 12:53

728x90

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

20221101(화) 목차 - 쿠키 - 표현언어 Expression Language : EL < 쿠키 > HTTP 프로토콜은 웹 브라우저(클라이언트)의 요청에 대한 응답을 하고 나면 해당 클라이언트와의 연결을 지속하지 않음. 상태가 없는

dorothy-yang.tistory.com

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

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) 이제 이미지를 바꿔보자!