728x90 반응형 전체 글102 체크박스 활용하기 (Multiple Selection 수정or삭제) - 2/2 오늘은 저번 글에 이어서 백 쪽의 로직은 어떻게 동작하는지 작성해보려고 한다. 먼저 view 단에서 배열을 통해 보내준 값을 컨트롤러 단에서 어떻게 받는지는 아래와 같다. CONTROLLER //코드 활성화/비활성화 @GetMapping(value = "/disableCode") public String disableCode(@RequestParam("articlesArray") String[] articlesArray) { for(String arr:articlesArray) { Integer codeNo = Integer.valueOf(arr); codeService.disableCode(codeNo); } return "redirect:/selectCode"; } 원리는 향상된 for문으로 arti.. 2022. 10. 6. 체크박스 활용하기 (Multiple Selection 수정or삭제) - 1/2 메일 사이트를 가면 체크박스가 있고 체크한 행의 정보를 수정할 수 있는 기능 또는 로직이 구현되어 있다. 이런식으로 선택해서 이런식으로 버튼 하나로 선택된 모든 행의 정보를 수정할 수 있는 것이다. 물론 바로 삭제 또는 수정 로직을 행하진 않고 아래 처럼 컨펌 모달이 뜨게끔 만드는 것이 더욱 좋다. 자 이제 이러한 로직을 구현하기 위해서는 대략 5가지 로직이 필요하다. 1. 최상단의 체크박스 선택 시 모든 체크박스가 선택되게 하는 로직 2. 삭제 또는 수정 버튼을 눌렀을 때 해당 행의 기준이 되는 정보를 매개변수로 두고 그 매개변수를 반복문을 통해 배열에 넣고 모달에 전달하는 로직 (동기 or 비동기는 선택사항) 3. 그 배열을 반복문에 돌려서 순차적으로 실질적인 연산을 하는 함수에 전달하는 로직. 4... 2022. 9. 30. [Front] 스크롤은 가능하되 스크롤 안 보이게 하기 (쉬움) 바로 들어가보자. 모달이 있다고 가정해보자. # 상위 DIV ID { width: 100%; height: 100%; overflow: hidden; } # 하위 DIV ID { width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; /* Increase/decrease this value for cross-browser compatibility */ box-sizing: content-box; /* So the width will be 100% + 17px */ } 부트스트랩 모달 기준으로 설명을 하자면? Modal title 출처: https://stackoverflow.com/questions/16670931/hide-scroll-b.. 2022. 9. 29. [Spring Boot] 페이징이 어렵다고? 이렇게만 하세요 일단 VIEW 는 본인이 사용중인 템플릿에 아래 코드를 복붙한다 CONTROLLER @GetMapping("/아까 그 URL") String pagingList(Model model, Pageable pageable) { Page p = null; p = 사용하는서비스.findPagingList(pageable, "idx"); int totalPage = p.getTotalPages(); int nowPage = p.getPageable().getPageNumber() + 1; int startPage = Math.max(nowPage - 4, 1); int endPage = Math.min(nowPage + 4, p.getTotalPages()); model.addAttribute("boardList".. 2022. 9. 24. [Spring Boot] 세상 쉬운 검색창(검색 로직) 만들기 1-2 (백 로직) 샘플 Entity는 Staff로 정하고 설명을 위해 제공 @Getter @Entity @NoArgsConstructor public class Staff { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) private Long id; private String name; private Integer age; } Controller @Controller public class StaffController { private final StaffService staffService; public StaffController(StaffService staffService) { this.staffService = staffService; } @GetMappin.. 2022. 9. 24. [Spring Boot] 세상 쉬운 검색창(검색 로직) 만들기 1-1 (View) 웹페이지하면 검색창 없는 곳이 드물정도로 검색창이 많은데 이 검색창 구현이 생각보다 엄청 쉽다는 것을 개발을 처음 접한 사람들은 모를 수 있다. 바로 구현해보자. 1. View단에서 텍스트를 입력할 수 있는 INPUT 태그를 만든다. 1-1. 위 INPUT 태그에 사용자가 입력한 값을 컨트롤러에 보낼 수 있도록 Form으로 감싸준다. ... 1-2. Submit 역할을 하는 버튼을 만들고 응용하고 싶다면 이를 검색이라는 텍스트 대신 아이콘으로 대신한다. 검색 1-3. [ 응용 ] 아이콘을 누르지 않고 그냥 엔터를 쳐도 값이 전달되도록 한다. function enterkey() { if (window.event.keyCode == 13) { document.getElementById("폼 ID").subm.. 2022. 9. 24. [Spring] 모달 쉽게 띄우기 + 모달에 매개변수 값 전달하기 (타임리프) 1. 부트스트랩 5버전의 CDN 추가 2. 모달을 호출할 버튼을 만든다. data-target 에 모달 ID를 넣으면 모달이 호출되는 원리이다. Launch demo modal 3. 모달을 만든다 Modal title 이곳에 내용을 적어주세요 Close Save changes 4. [ 응용하기 ] 하드코딩을 하지 않는다면 변수값을 가져와야 할텐데 타임리프라는 템플릿 엔진을 사용하면서 모달 외부에서 사용한 타임리프 변수값을 가져오고 싶은데 방법을 모르겠고 제이쿼리나 자바스크립트로 어떻게 값은 가져왔는데 하필이면 동적 테이블이라 첫번 째 행의 의 값만 주구장창 나온다면? TH:ATTR을 활용한다. 어떻게? 4-1 [ 설명 ] 버튼은 아래처럼 data-target을 th:attr 안에 넣는다 th:attr=".. 2022. 9. 21. [Spring] 객체지향 설계 5 원칙 SOLID란? feat.클린코드 객체지향 설계의 핵심은 자고로 응집도는 높고 결합도는 낮은 프로그램을 설계하는 것이다. 그렇다면 응집도는 무엇이고 결합도는 또 무엇일까? [ 응집도(Cohesion) ] 한마디로 내부 요소들의 연관성이다. 예를 들어 하나의 클래스에서 함수(method)와 변수가 통일된 목적을 가지고 연관되어 있다면 응집도가 높은 것이고 이 함수는 이 변수에 저 함수는 저 변수에 뒤죽박죽이라면 그 클래스는 다양한 목적이 있는 클래스가 되고 목적을 기준으로 더 쪼개질 수 있으므로 단일 목적으로서의 응집도가 낮다고 할 수 있다. 더 쉬운 예시: 메뉴가 하나뿐인 오래된 음식점을 생각해보자. 그 음식점의 모든 내부 요소들은 그 하나의 메뉴를 만드는 것이라는 목적으로 똘똘 뭉쳐서 연관성이 매우 높을 것이다. 반면 메뉴가 여러개인 .. 2022. 9. 21. [jQuery] Datatable 로 쉽게 데이터 조회하는 테이블 만들기 1. CDN을 통해 외부 라이브러리를 쉽게 import 하기 2. 테이블을 만들면 된다 Email Name 3. 이제 늘 하던대로 VO나 Entity 하나 두고 html단에서 ajax 통신으로 컨트롤러->서비스->리포지토리로 가서 데이터를 긁어오면 된다. 아래는 샘플 서버사이드 스크립트 테이블 끗 2022. 9. 15. 관계형 데이터베이스 (1:1, 1:N, N:M ) 1:1 관계(일대일 관계) 1:1 관계란 어느 엔티티 쪽에서 상대 엔티티와 반드시 단 하나의 관계를 가지는 것을 말한다. 예를 들어, 우리나라에서 결혼 제도는 일부일처제로, 한 남자는 한 여자와만 결혼을 할 수 있다. 남편 또는 부인을 2명 이상 둘 수 없는데, 이러한 관계가 1:1 관계다. 1:N 관계(일대다 관계) 1:N 관계는 한 쪽 엔티티가 관계를 맺은 엔티티 쪽의 여러 객체를 가질 수 있는 것을 의미한다. 예를 들어, 부모와 자식 관계를 생각해보면, 부모는 자식을 여러명 가질 수 있다. 하지만 자식 입장에서는 일반적으로 부모를 하나만 가질 수 있다. 이러한 관계를 1:N 관계라고 하며, 계층적인 구조로 이해할 수도 있다. 여러 명의 자식(N)의 입장에서 한 쌍의 부모(1)중 어떤 부모에 속해 있.. 2022. 9. 6. [Oracle] 계층형 쿼리 - START WITH ~ CONNECT BY 계층형 쿼리란? 부모, 자식 간의 수직관계를 트리 구조 형태로 보여주는 쿼리 회사 조직도를 예시로 들어보자. '회사'는 최상위계층이고, 회사를 중심으로 개발부, 경영지원부, 영업부 세 부서로 나뉜다. 계속해서 부서를 중심으로 하위 계층이 생성되어 있다고 가정하자. 이를 테이블로 나타내면 아래와 같다. 부서번호는 고유식별자로 Primary Key가 된다. START WITH SELECT * FROM EMP_TB START WITH 상위부서번호 IS NULL; 회사는 그보다 상위부서가 없기 때문에 상위부서를 NULL로 주며, 부서번호가 NULL 인 것을 찾으면 최상위 부서를 찾게 되는 원리이다 CONNECT BY PRIOR 하위트리 = 상위트리 폭포를 생각하면 쉽다. 위에서 아래로 내려가는 그런 기본 트리구.. 2022. 9. 6. MyBatis vs JPA 기본 배경: MVC패턴을 안다면 MODEL이 DB에 접속하는 것 또한 알 것이다. 그렇다면 DB에 접속하기 위해서는 뭐가 필요할까? 바로 JDBC이다. JAVA로 DB에 CONNECT 하겠다는 것이다. 그렇다면 이 JDBC를 사용하면 되지 왜 MyBatis 나 JPA같은걸 쓰는걸까? 이유는 간단하다. JDBC가 귀찮고 복잡하기 때문이다. 그래서 개발자들끼리 이 귀찮고 복잡하고 어려운 JDBC를 조금 더 쉽게 사용할 수 있는 방법이 없을까? 매번 고생하지 말고 JDBC 형식을 미리 만들어놓고 새 프로젝트를 할 때는 그 형식에 값만 넣으면 어떨까? 해서 나온 것이 MyBatis다. MyBatis 를 통해 초반에 좀 번거럽지만 설정파일과 매퍼를 만들어 놓고 경로 설정을 해두면 그 매퍼에 형식에 맞춰서 쿼리문만.. 2022. 8. 26. 이전 1 ··· 4 5 6 7 8 9 다음 728x90 반응형