18. 장바구니 다중 삭제

 

 

---

 

 

✅ cartList.jsp

- 전체 선택하는 체크박스에 id값 지정

 

- 지정한 id값을 사용해 .onclick 이벤트 준다.

 

- 체크 여부 확인 위한 alert 작성

- this는 allCheck 를 의미한다

 

- class 지정값 확인

 

- check 해야될 체크박스를 얻어 변수 chk에 담아준다.

 

< 전체선택을 누르면 아래에 있는 모든 목록이 다 선택되게 하는 로직>

- allCheck 라는 변수에 담아준다.

- .each()는 선택한 요소가 여러 개일 때 각각에 대하여 반복하여 함수를 실행하게 한다.

- .check를 반복하겠다.

 

- 전체 삭제하기를 버튼으로 바꿔준다.

- 아래 캡쳐엔 오타 유의 </busson>  =>  </button>

 

- button에 id를 먼저 준다.

 

- 지정한 id 값에 이벤트를 준다.

 

- button이 form 태그 밖에 있기 때문에 form 태그 안의 submit 버튼처럼 동작처리 하기 위한 로직

- form 태그는 배열이기 때문에 인덱스를 지정하고 변수 f에 담는다.

- form 태그에 있는 action과 method를 호출한다.

 

 

 

 

 

✅ CartDeleteAllServlet

 

- submit을 테스트하기 위해 일단 main으로 가게 해본다.

 

 

✅ cartList.jsp

- action값과 method값 지정

- f.submit(); 으로 submit 해준다.

 

< form 태그 밖에 있는 button을 form 태그 안의 submit 버튼처럼 동작 처리 하는 로직 >

 

- 삭제해주기

 

- value 값을 ${dto.num}으로 변경

 

 

💻 결과

- 선택할 것들 체크한 후 전체 삭제하기 버튼을 클릭하면

 

- 체크한 것들이 url에 넘어가는 것 확인

 

 

- url에 넘어간 check 목록

 

 

✅ CartDeleteAllServlet

- 체크한 목록들을 배열에 담고

- String 배열을 List로 변경한다.

 

 

✅ CartMapper.xml 에 동적쿼리문 작성

 

✅ CartDAO 

 

✅ CartService

 

✅ CartServiceImpl

 

✅ CartDeleteAllServlet

- 다시 돌아와 서비스와 연동해 del_list를 DAO까지 전달할 코드 작성

- 테스트 하기 위해 썼던 main을 지우고 CartListServlet으로 수정해준다.

 

 

---

 

💻 결과