본문 바로가기
✨ Back-end/Spring-Boot

[Spring] 쇼핑몰 - 5 카테고리 사용여부 체크

by 환풍 2023. 3. 27.
728x90
반응형

 


 

위에 사진에있는 사용여부를 radio 박스로 바꿔보려고 한다.

 

Radio 박스의 class는 복붙해왔다. 하지만 이렇게 복붙만 해와도 적용이 잘 안됄수도 있다.

 

 

이렇게 사용자가 편한대로 바꿔줄 수 있다.

 

카테고리가 존재할때, th:each를 통해 cateList에 저장된 데이터 VO들을 category 이름으로 뽑아줄 수 있다.

 

이렇게 바꿔도 불과하고, 아래와 같이 orderNum이 2인 악세사리는 사용중에 체크가 되어있다.

is_use가 N이지만, 순번 2인 악세사리에는 사용중으로 checked되어있다.

 

코드를 이런식으로 바꿔주면 잘 뜰 것이다.

 

 

 

th:onchange를 사용해서 js 함수를 만들어준다. 이때 js로 보낼 cateCode를 데이터값으로 받아온다.

 

cate_manage.js

url로 컨트롤로 위 html에서 받은  cateCode를  가지고 컨트롤로 가주면 된다.

AdminController 컨트롤러

cateCode라는 매개변수를 사용해서 update 쿼리에 넣어야하는데, 

아직 만들지 않았으므로 update쿼리를 만들러 mapper로 가자.

 

admin-mapper

ex) DECODE는 첫번째 데이터가 Y였다면 N, N이었다면 Y이다.

 

AdminService 인터페이스

매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성)
매개변수 : 쿼리 실행 시 빈 값을 채울 용도
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> 객체.

 

AdminServiceImpl 클래스

 

AdminController 컨트롤러

이렇게  ajax에서 받아온 cateCode를 컨트롤러에서 쿼리를 적용시켜 다시 ajax로 return 시켜준다.

 

cate_manage.js

js파일에서 result 값을 받아 완료해줄 수있다.

 

.하지만, 다시 함수가 실행될때 아래와 같이 메소드가 있다.

cate_manage.js  

addGood() 함수

상품을 등록했을 때, getCateListAjax() 를 통해 목록으로 돌아와준다.

 

getCateListAjax() 함수 (완성본)

 

 

getCateListAjax() 

여기부분을 바꿔줘야한다.

 

cate_manage.html

html에서 이 부분을 가지고와서 

 

js -> getCateListAjax() 함수

여기선 타임리프 th가 안되므로, name앞에 있는 th를 빼고, th:check 있는 부분도 빼자. 

그리고 if(result[i].isUse =='Y'를 넣어서 checked만 써주자.

onchange 도 th가 안되니까  빼주고, ${category.isUse =='Y' } 대신 ' ' 홀따옴표로 감싸서 '${result[i].cateCode}'  와같은

방식으로 표현해주자.

 

이렇게 최종적으로 완성해주면 된다.

 

 

다음 포스팅에서는 삭제에 대해서 해보려고한다.

728x90
반응형

댓글