본문 바로가기

카테고리388

[Spring] 쇼핑몰 - 40 Bootstrap에서 가져온 태그 활용하기 cart_buy.html data-bs-target에 있는 id가 밑에있는 div의 id와 동일하다. 그러면 button에 있는 data-bs-target은 누를때마다 밑에 있는 상세내용이 나오는 div가 열고 닫히게 된다. 개발자 도구에서 확인해보면 이런식으로 전체 이름이 같지않고, 각 패널마다 이름이 주어져서 하나를 클릭해도 전체 열기 혹은 닫기가 안되는 것을 볼 수 있다. 추가적으로 button 클래스에 collapsed를 추가해주었고, div 클래스에 show를 제거해주면서 보이는 이미지를 조금 바꿨다. 버튼을 눌렀을 때만 파란색 표시가되고, 열리지 않은 목록들은 하얀색으로 표시되는 것을 볼 수 있다. - 접힐 때 : class-collpased 추가 , aria-expanded = "false".. 2023. 4. 12.
[Spring] 쇼핑몰 - 39 장바구니에 담긴 구매 리스트 왼쪽처럼 비슷하게 구매내역 페이지를 구성해보았다. cart.js ajax에서 통신에 성공하게 되면 buys/buysPage 컨트롤러로 이동하게 된다. 먼저, 구매한 상품에 대해 전체 조회하는 데이터를 DB에서 만들어보자. buy-mapper.xml BUT_CNT과 DETAIL_BUY_PRICE를 위해 collection으로 buyDetailList를 끌어와 줄 수 있다. 쿼리문에 있는 아래 4개 데이터는 어떻게 가져올 수 있을까 ATTACHED_FILE_NAME , ITEM_NAME , ITEM_PRICE (SELECT COUNT(BUY_DETAIL_CODE) FROM BUY_DETAIL WHERE BUY_CODE = BUY.BUY_CODE) AS ETC buyDetailVO에는 상품 하나를 샀을때 조회.. 2023. 4. 11.
[json] Map데이터 받아오는 8가지 방법 json_test.html TestController json_test.js ajax에 JSON.stringify(stu)는 문자로 보내는데, json 형태로 바꿔서 던져주라는 것이다. html로 넘어와서 데이터 받기를 누르면 오른쪽 컨트롤러로 넘어가면서 콘솔창으로 Map data들이 뜨게된다. Controller Map 함수를 사용하게 되면 이와 같이 data에 있는 값들이 콘솔창에 json 형태로 나오게 된다. ajax 위에서 만든 stu 함수를 컨트롤러로 json 형태로 보내게 된다. 추가적으로 name으로 java, age로 20 데이터도 함께 보내게 된다. ajax에 있는 데이터 값이 json 형태로 하나 나오게 되고, 나머지는 임의로 넣어 줬던 name과 age가 출력된다. 맨위는 데이터를 통.. 2023. 4. 10.
파이썬(python) - for문 사용법 이번에는 파이썬에서 For문을 어떻게 사용하는지 알아보려고한다. java와 또 다르게 파이썬에서는 아주 간단하게 for문을 사용할 수 있으며, 들여쓰기가 중요하다. 리스트를 생성할 때에도 따로 자료형을 설정해주지 않는다. 2023. 4. 10.
[Spring] 쇼핑몰 - 38 장바구니 선택 구매 선택구매에 대해서 알아보자. 내가 구매하고자하는 수량, 아이템 코드, 총 가격을 모두 들고와 보자. 구매하고자하는 상품 수 * 2(ITEM_CODE, BUY_CNT, TOTAL_PRICE)가 필요하고 + 1 (총 구매가격) 이 필요하다. json으로 데이터를 가지고 오면 자바에서는 그것을 Map으로 쓴다. th:data-item-code="${cart.itemCode}" 아이템코드 th:data-buy-cnt="${cart.cartCnt}" 수량 th:data-detail-buy-price="${cart.totalPrice}" 총가격 체크박스를 클릭 시 data를 이용해 데이터를 강제적으로 넣어보았다. js파일에서 buys 함수를 만든후 체크될 데이터가 여러개 있으므로 반복문으로 돌렸다. 체크 박스를 누.. 2023. 4. 7.
파이썬(python) - 파이썬의 리스트(List) 변수 선언 및 사용법 리스트를 생성하고, 출력하는 방법 리스트에 데이터 추가하는 방법 리스트에 리스트가 들어간 데이터 출력하는 방법 2023. 4. 6.
파이썬(python) - 파이썬의 변수와 출력문, IF 사용법 파이썬의 변수와 출력문, IF 사용법 IF 문 IF 문 기본 문법 if 조건 : 실행코드 elif 조건 : 실행코드 else : 실행코드 데이터 입력 다음은 파이썬에서 리스트 사용하는 방법에 대해서 알아보자. 2023. 4. 6.
파이썬(python) - Jupyter 사용법 HTML 삽입 미리보기할 수 없는 소스 주피터 많이 사용하는 단축키 - a : 현재 셀에서 윗줄에 셀 추가 - b : 현재 셀에서 아랫줄에 셀 추가 - dd : 현재 셀 삭제 - ctrl + enter : 현재 셀 실행 - shift + enter : 현재 셀 실행 후 다음 셀로 이동 - m : 코드 창을 마크다운 창으로 변경 - y : 마크다운 창을 코드 창으로 변경 - c : 현재 셀 복사 - v : 복사한 셀 붙여넣기 - x : 현재 셀 잘라내기 - z : 현재 셀 이전 상태로 되돌리기 - shift + m : 현재 셀과 아래 셀을 병합 - tab : 해당 글자로 시작하는 함수 확인 가능(자동완성 기능) 주피터 노트북 테마 및 폰트 변경 법 1. 폰트 압축파일의 압축을 푼다. 2. 압축 푼 파일의 .. 2023. 4. 6.
[Spring] 쇼핑몰 - 37 장바구니 선택 삭제 선택 삭제를 통해 체크 된 상품이 모두 삭제 되는 것을 알아보자. cart.html html에서 checkbox에 value값을 넣어주었다. 이 체크 박스에는 cartVO에 있는 cartCode 데이터를 담고있다. html에서 F12를 눌러 콘솔창을 보면 체크박스를 클릭하였을 때, value 값으로 해당 cartCode가 들어와있는 걸 볼 수있다. 그리고 선택삭제 버튼을 누르게 되면 deleteCarts()라는 js 함수가 실행되도록 구현하였다. cart.js 해당 js에서 chks 변수에 check박스 들이 가진 클래스 chk가 체크되어있는 것들을 모두 넘겨주었다. 해당 js와 html이 연동되어 체크박스가 만약 아무것도 체크되어있지 않다면 선택삭제 버튼을 눌렀을때, alert으로 선택 상품이 없다는 .. 2023. 4. 6.
[Spring] 쇼핑몰 - 36 장바구니 체크박스 해제시 변경 데이터 체크 박스가 해제되었을때, 구매 금액에서도 제외될 수 있도록 해보자. cart.html 반복되는 체크박스 각 한줄들이 클릭될 때마다 js함수를 setFinalPrice 이름으로 실행시켰다 속성명 앞에 data- 넣으면 임의의 데이터를 사용할 수 있다. data- 뒤에 memAge와 같이 대문자를 표현할 때에는 data-mem-age 를 사용하면 된다. th:attr 은 타임리프 문법이어서 사용했다 cart.js 클래스로 chk로 된 모든 체크박스들이 체크표시 되어있는 값들을 checkedChks로 데이터를 저장했다. 그리고, totalPriceChk 데이터 값을 chk의 가장 가까운 부모테이블로 찾아간 값을 spanTag로 저장한다. 위 html에서 data-name으로 데이터 java 넣었다. 콘솔창으.. 2023. 4. 6.
[Spring] 쇼핑몰 - 35 장바구니 상품 수량 수정(UPDATE) 수정 (UPDATE) cart-mapper.xml 장바구니 상품 수량을 수정하기 위해서 먼저 mapper에서 수정 쿼리 update를 만들어주었다. 상품 수량 데이터 cartCnt가 필요하고, 어떤 상품을 업데이트 해줄 것인지 알기 위해 cartCode도 가지고왔다. Service 인터페이스, 클래스 매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성) 매개변수 : 쿼리 실행 시 빈 값을 채울 용도 1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음 2. 채워줄 값이 하나일 경우 2-1) 채워줄 값이 숫자인 경우 : 매개변수 int형 하나 2-2) 채워줄 값이 문자인 경우 : 매개변수 String형 하나 3. 채워줄 값이 여러개인 경우 : 매개변수는 VO 객체. 리턴타입 : 쿼리 실행.. 2023. 4. 6.
[Spring] 쇼핑몰 - 34 장바구니 상품 중첩하기(MERGE INTO) https://bright-landscape.tistory.com/104 [Oracle / SQL] MERGE INTO 사용방법 (두 테이블, 한 테이블 DUAL) MELON_CHART HTML 삽입 미리보기할 수 없는 소스 MELON_CHART_NEW HTML 삽입 미리보기할 수 없는 소스 MERGE INTO HTML 삽입 미리보기할 수 없는 소스 SELECT * FROM MELON_CHART; 위와 같이 MELON_CHART에 있는 값을 다시한 bright-landscape.tistory.com 예전에 DB를 공부할 때 MERGE INTO에 대해서 공부한 내용을 기록한 것이 있다. cart-mapper.xml 기존에 있었던 장바구니에 상품 담기 쿼리인 INSERT 문에 MERGE INTO를 추가해줘야.. 2023. 4. 6.

티스토리툴바