[Spring] 쇼핑몰 - 30 장바구니

---

DB에 장바구니 정보 테이블 쿼리를 생성해주었고, Spring에 VO로 CartVO 데이터들을 작성해주었다.

 

item_detail.html

html에서 js를 실행하기 위해 버튼에 onclick을 만들어 주었고,

goCart() 자바스크립트가 실행되면  static 밑에 있는 item_detail에 있는 js 파일이 실행된다.

 

장바구니로  가기전에, 로그인이 되었는지부터 확인해봐야한다.

 

 

로그인 정보를 알수 있도록 하기위해 onclick버튼을 th:onclick으로 하면서 함수안에 데이터들을 함께 조회해준다.

로그인이 되지 않았을 때에는 session.loginInfo가 null로 떨어진다.

로그인 했을 때에는 session.loginInfo가 MemberVO 데이터 값으로 출력된다.

따라서 이런식으로 삼항연산을 이용해서 memId값을 체크한 뒤 js파일로 넘겨준다.

추가적으로 장바구니에 등록할 상품을 알기 위해서 상품코드번호를 들고가주자.

item_detail.js

장바구니 버튼을 누르게 되면, goCart() js함수가 실행되며 memId와 itemCode를 가지고 온다.

 

만약 memId가 ' ' 즉, 로그인되지 않았다면 로그인 해야하는 알람창이 뜰 것이고,  로그인 모달창이 뜰것이다.

 

로그인하여 memId의 값이 널값이 아니라면, goCartAjax함수를 실행하게 되는데, 이때 itemCode 데이터를 가지고간다.

수량에 id = cntInput 를 주어 js에서 데이터를 가지고왔고, 컨트롤로 cntInput과 itemCode 두개의 데이터를 보낸다.

 

컨트롤러로 가기전, mapper와 service 기능을 만들어주자.

cart-mapper.xml

CartService 인터페이스, 클래스

매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성)
매개변수 : 쿼리 실행 시 빈 값을 채울 용도
1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음
2. 채워줄 값이 하나일 경우
2-1) 채워줄 값이 숫자인 경우 : 매개변수 int형 하나
2-2) 채워줄 값이 문자인 경우 : 매개변수 String형 하나
3. 채워줄 값이 여러개인 경우 : 매개변수는 VO 객체.
리턴타입 : 쿼리 실행 결과를 어떻게 받아올지에 대한 정의
INSERT, UPDATE, DELETE 쿼리 실행 결과는
리턴타입을 int 혹은 void 사용하면됨. int로 받을 땐 return 필요o  void는 필요x
SELECT 쿼리 결과의 리턴타입은 크게 두 가지로 나뉨.
조회결과 데이터가 무조건 한줄만 조회 : VO 객체.
조회 결과 데이터가 0줄이상 가변적일 경우 : List<VO> 객체.

CartController 컨트롤러

컨트롤러로 돌아와서, 쿼리문에 넣을 cartVO 매개변수를 생성해주고,

로그인 정보 값을 받아오기 위해 session도 만들어주었다.

현재 MemberVO 객체에 들어가있는 loginInfo 정보를 출력해보면

콘솔창에 이렇게 memId 값이 들어와 있는 것을 확인해볼 수 있다.

따라서 loginInfo에 저장된 memId를 cartVO에 저장시켜주고, 장바구니 등록 쿼리에 집어넣어주면 된다.

이런 식으로 쿼리에 memId가 들어가 있는 것을 확인해볼 수 있다.

DB를 보더라도 이렇게 데이터가 잘 들어와 진 것을 확인할 수 있다.

item_detail.js

컨트롤러에서 Ajax가 완료되면 다시 js로 넘어오면서 result값을 갖게 되는데,

통신에 성공했으면 빨간 박스에 있는 코드들을 실행하게 된다. 

 

그리고 location.href='/cart/cartList'; 경로로 이동하게 되는데, 이때 경로는 컨트롤러이다.

CartController 컨트롤러

이 컨트롤러에서 cart.html이라는 경로로 이동하게 되면 

cart.html

이렇게 장바구니 페이지 까지 오는 것을 확인할 수 있다. 

다음 포스팅에서는 장바구니에 담긴 아이템 정보들을 뿌려보자.