20220823_tue
프로젝트명: shop_Teacher
실습내용
- 쇼핑몰 메뉴판에서 상품별 목록조회 기능 구현
- 아이템 테이블 & 상품카테고리 테이블 (DB)
- SELECT * FROM SHOP_ITEM;
- SELECT * FROM ITEM_CATEGORY;
- 두 테이블 모두 공통으로 갖고있는 컬럼은 CATE_CODE 이다.
- item-mapper.xml 에서 상품목록조회 이전 작성한 쿼리문을 보자.
- if 문을 조건문 쿼리문 내에 작성한다.
: 만약에 cateCode 값이 null값이면서 공백(문자열)값이 아니라면 cateCode값은 cateCode값으로 조건문에 넣어서 목록을 조회한다.
ex) 소설(CATE_001) 도서상품만 조회하려면, 'CATE_001'값이 들어와야 if문 조건절로 들어와서 소설목록만 조회가 된다.AND CATE_CODE = '#{cateCode}' </if>```
<select id="selectItemList" resultMap="itemView">
SELECT ITEM_CODE
, ITEM_NAME
, ITEM_PRICE
, ATTACHED_NAME
FROM ITEM_VIEW
WHERE IS_MAIN = 'Y'
<if test="cateCode != null and !cateCode.equals('')">
AND CATE_CODE = '#{cateCode}'
</if>
ORDER BY ITEM_CODE DESC
</select>-
menu.jsp 가서 모두 a태그를 달아준다. 대신 cateCode를 가지고 가야한다.
-
itemController 가서 상품목록조회 if문 에서 cateCode 받아야한다.
-
itemService와 itemServiceImpl에서 mapper 쿼리문 에서 작성하며 추가된 매개변수cateCode를 매개변수로 넣어 수정한다.
-
주의!!! 빈값데려오는 데이터가 여러개여서 객체(boardDTO)로 넘어올때만 getter를 사용한다!!!
ex) 만약 게시글제목 데이터를 가져온다면, boardDTO.getTitle();
그래서 넘어오는 자료형을 보고 getter를 호출한다!!!
위에는 자료형이 boardDTO 이기 때문에 사용한 것!
예) int a = 10;
a.~~ -> 사용불가!! a 객체가 아니라 정수형 변수이기때문에!
그냥 boardNum 하나의 매개변수(문자열)만 데이터가 넘어올 때는 getter사용 불가!
boardNum.getBoardNum (x) -> 위에 처럼 마찬가지로 사용불가하다!
데이터를 넘길 때 방식
1) 하나의 문자열 데이터로 넘길 때: String cateCode
2) 객체명으로 데이터를 넘길 때: ItemDTO itemDTO
- 그래서 매개변수 빈값 하나만! 채워줘야 할때는 이름 신경안쓴다!!!! 그냥 데이터 넣어줄 때 어차피 빈공간이 하나이기때문에 어떻게 작성하든지 상관없이 채워주기때문에!
하지만 그래도 ${}빈값 안에는 getter호출은 아니지만 소문자로 일반적으로 깔끔하게 작성한다.
--> 그러나 조건절 안의 쿼리에서 #{cateCode} 빈값 하나만 있을 때는 getter 호출이 아니지만, if문이나 forEach문 빈값은 무조건!! getter 호출이기 때문에 if문 안에 있는 cateCode 라는 매개변수가 또 있기 때문에 itemDTO 라는 객체명을 만들어서 itemService에 매개변수로 들어가야한다!!!!!!!<if test="cateCode != null and !cateCode.equals('')"> AND CATE_CODE = '#{cateCode}' </if>
실습내용
- 장바구니화면에서 '선택구매','선택삭제' 버튼기능 구현
- 선택구매버튼을 클릭하면, '선택한 상품을 구매하시겠습니까?'팝업창을 띄운다.
- cart_list.js 파(자바스트립트 파일내 작성)
function goBuy(){ const checkedCnt = document.querySelectorAll('.chk:Checked').length;//체크박스들중에서 체크된 것들만!그것의 갯수. if(checkedCnt == 0){ alert('선택한 상품이 없습니다.'); return ; //리턴의 2가지 기능 //1)데이터를 넘기도록 돌려줄 값을 쓸 때(일반적) //2)자바에서는 메소드이기때문에 뒤에 아무값도없으면 더이상 읽지않도록 함수종료 기능. } //넘겨야하는 데이터: 내가 체크한 ITEM_CODE,BUY_CNT,BUY_CODE, //TOTAL_PRICE(상관없어서 넘기지않음) location.href = 'insertBuy.buy?';
실습내용
: submit 버튼 두개있을 때 form태그 사용시, 자바스크립트 이용하는 방법
- item_detail.jsp
<body> <div class="detail-container"> <div class="firstDiv"> <div>Main image <c:forEach var="itemView" items="${item}"> <c:if test="${itemView.isMain eq 'Y' }"> <img width="300px" height="360px" src="images/${itemView.attachedName}" name="attachedName"> </c:if> </c:forEach> </div> <div><!-- item매퍼에서 상세조회 쿼리를 만든 결과값들 사용하는 것들... --> <form action="insertCart.ca" method="post"> <input type="hidden" name="itemCode" value="${item[0].itemCode}"> <div>Name : <!-- item 은 List이다!!! 그래서 그냥 item. 으로 사용불가능! --> ${item[0].itemName}</div> <div>Price : <span id="priceSpan">${item[0].itemPrice}</span> </div> <div>Stock : <input type="number" class="my-input" name="putCnt" value="1" min="1"> </div> <div>Total Price : <span id="totalPriceSpan">${item[0].itemPrice}</span></div> <div> <div class="btnDiv"> <!-- submit 버튼이 두개이상있을 때 form 사용법은 자바스크립트!! --> <input type="button" class="btn" value="구매하기" onclick="goBuy();" > <input type="submit" class="btn" value="장바구니"> </div> </div> </form> </div> </div> <div class="secDiv"> <div>itemComment :</div> <div>${item[0].itemComment}</div> </div> <div class="thdDiv"> <div>Detail.</div> <div> <c:forEach var="itemView" items="${item}"> <c:if test="${itemView.isMain eq 'N' }"> <img src="images/${itemView.attachedName}"> </c:if> </c:forEach> </div> </div> </div> </body>
- 자바스크립트문
: 장바구니 상품목록페이지에서 같은 상품끼리는 병합시켜서 보이도록 기능 구현(수량,단가,총가격..)<script type="text/javascript"> //구매하기 버튼 클릭 시 function goBuy() { const formTag = document.querySelector('form');//폼태그 자체를 선택 formTag.action = 'insertBuy.buy';//폼태그의 액션 속성값을 insertBuy.buy 으로 변경하기. formTag.submit();//위에서 변경된 곳으로 페이지이동한다. } </script>
실습내용
- 상품상세보기 페이지에서 구매하기 버튼 클릭시, 입력한 데이터값이 'shop_buy'테이블에 입려되어 조회.(insert)
- shop_buy,buy_detail 테이블 조회
- 트랜잭션 처리 사용하기
- buyDTO
package dto;
public class BuyDTO {
private String buyCode;
private String memId;
private String buyDate;
private int totalPrice;
//컨트롤러에서 필요한 변수는 만들어서 사용한다.(getter,setter까지)
private int putCnt;
private String itemCode;
public int getPutCnt() {
return putCnt;
}
public void setPutCnt(int putCnt) {
this.putCnt = putCnt;
}
public String getItemCode() {
return itemCode;
}
public void setItemCode(String itemCode) {
this.itemCode = itemCode;
}
public String getBuyCode() {
return buyCode;
}
public void setBuyCode(String buyCode) {
this.buyCode = buyCode;
}
public String getMemId() {
return memId;
}
public void setMemId(String memId) {
this.memId = memId;
}
public String getBuyDate() {
return buyDate;
}
public void setBuyDate(String buyDate) {
this.buyDate = buyDate;
}
public int getTotalPrice() {
return totalPrice;
}
public void setTotalPrice(int totalPrice) {
this.totalPrice = totalPrice;
}
@Override
public String toString() {
return "BuyDTO [buyCode=" + buyCode + ", memId=" + memId + ", buyDate=" + buyDate + ", totalPrice=" + totalPrice
+ ", buyDetailDTO=" + "]";
}
}- buy-mapper
※항상 맵퍼파일 만든 후,configuration.xml 파일에서 추가해야 인식해준다!!!
<mapper resource="sqlmap/buy-mapper.xml" />
```<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="buyMapper">
<!-- 구매 정보 등록 -->
<!-- insert 할때 주의!
date 처럼 기본적으로 자동값이 있는 경우는 넣지않는다! -->
<insert id="insertBuy">
INSERT INTO SHOP_BUY(
BUY_CODE
, MEM_ID
, TOTAL_PRICE
)VALUES(
#{buyCode}
, #{memId}
, #{putCnt} * (SELECT ITEM_PRICE
FROM SHOP_ITEM
WHERE ITEM_CODE = #{itemCode})
)
</insert>
<!-- 구매코드 1씩 증가 -->
<!--resultType="String" 의 뜻은 디비에서 실제로 쿼리실행했을 때 나오는 결과를 자바로 가져올때는 문자열로 가져오겠다. -->
<select id="selectNextBuyCode" resultType="String">
SELECT 'BUY_'||LPAD(NVL(MAX(TO_NUMBER(SUBSTR(BUY_CODE, 5))), 0) + 1, 3, 0)
FROM SHOP_BUY
</select>
<!-- 구매하기_상세 -->
<insert id="insertBuyDetail" >
INSERT INTO SHOP_BUY(
BUY_DETAIL_CODE
,ITEM_CODE
,BUY_CNT
,BUY_CODE
)VALUES(
#{buyDetailCode}
,#{itemCode}
,#{buyCnt}
,#{buyCode}
)
</insert>
</mapper>- BuyController
@WebServlet("*.buy")
public class BuyController extends HttpServlet {
private static final long serialVersionUID = 1L;
private BuyService buyService = new BuyServiceImpl();
public BuyController() {
super();
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doProcess(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doProcess(request, response);
}
protected void doProcess(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//한글 인코딩 처리
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html;charset=UTF-8");
String requestURI = request.getRequestURI();
String contextPath = request.getContextPath();
String command = requestURI.substring(contextPath.length());
System.out.println("command = " + command);
String page = "jsp/template/template.jsp";
boolean isRediect = false;
String contentPage = "";
//구매하기
if(command.equals("/insertBuy.buy")) {
String itemCode = request.getParameter("itemCode");
int putCnt = Integer.parseInt(request.getParameter("putCnt"));
//다음에 들어갈 BUY_CODE 조회
String nextBuyCode = buyService.selectNextBuyCode();
HttpSession session = request.getSession();
MemberDTO loginInfo = (MemberDTO)session.getAttribute("loginInfo");
String memId = loginInfo.getMemId();
BuyDTO buyDTO = new BuyDTO();
buyDTO.setItemCode(itemCode);
buyDTO.setPutCnt(putCnt);
buyDTO.setMemId(memId);
buyDTO.setBuyCode(nextBuyCode);
buyService.insertBuy(buyDTO);
contentPage = "buy/buy_list.jsp";
}
request.setAttribute("contentPage", contentPage);
if(isRediect) {
response.sendRedirect(page);
}
else {
RequestDispatcher dispatcher = request.getRequestDispatcher(page);
dispatcher.forward(request, response);
}
}
}- buyService
public interface BuyService {
//장바구니 등록
//void insertCart(CartDTO cartDTO);//putCnt,memID,itemCode 모두 cartDTO에 들어있음.
//구매정보등록
void insertBuy(BuyDTO buyDTO);
//다음에 들어갈 구매코드 조회
String selectNextBuyCode();
}- buyServiceImpl
SqlSessionFactory sqlSessionFactory = SqlSessionManager.getSqlSession();
SqlSession sqlSession = sqlSessionFactory.openSession();
//구매정보등록
@Override
public void insertBuy(BuyDTO buyDTO) {
sqlSession.insert("buyMapper.insertBuy",buyDTO);
sqlSession.commit();
}
//다음에 들어갈 구매코드 1씩 증가
@Override
public String selectNextBuyCode() {
String nextBuyCode = sqlSession.selectOne("buyMapper.selectNextBuyCode");
sqlSession.commit();
return nextBuyCode;
}
}- buy_list.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri= "http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link type="text/css" rel="stylesheet" href="css/template/common.css">
<link type="text/css" rel="stylesheet" href="css/template/menu.css">
</head>
<body>
<h2>구매내역</h2>
<table>
<thead>
<tr>
<td>구매코드</td>
<td>아이디</td>
<td>구매날짜</td>
<td>총 가격</td>
</tr>
</thead>
<tr>//반복문은 수정중인 부분
<c:forEach var="cart" items="${cartList}">
<td>${cart.buyCode }</td>
<td>${sessionScope.loginInfo.memName}</td>
<td>${cart.buyDate }</td>
<td><fmt:formatNumber pattern="￦##,##0" value="${cart.totalPrice}"/></td>
</c:forEach>
</tr>
<tbody>
</tbody>
<tfoot>
</tfoot>
</table>
</body>
</html><결과>
shop_teacher 프로젝트 파일을 처음부터 실행을 하면,
구매하기 페이지에서 수량입력후 '구매하기' 버튼클릭시,
디비에서 shop_buy 테이블 조회시 데이터가 삽입된것을 알 수 있다.
- DB 테이블 조회결과
- 콘솔결과
DEBUG [2022-08-23 16:42:11,900] - ==> Preparing: INSERT INTO SHOP_BUY( BUY_CODE , MEM_ID , TOTAL_PRICE )VALUES( ? , ? , (SELECT ? * ITEM_PRICE FROM SHOP_ITEM WHERE ITEM_CODE = ?) ) DEBUG [2022-08-23 16:42:11,902] - ==> Parameters: BUY_001(String), abc(String), 1(Integer), ITEM_005(String) DEBUG [2022-08-23 16:42:11,918] - <== Updates: 1 DEBUG [2022-08-23 16:42:11,918] - Committing JDBC Connection [oracle.jdbc.driver.T4CConnection@5d82def5]
Dev.Vinch