728x90 반응형 개발자 전향 프로젝트93 체크박스 활용하기 (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. 이전 1 ··· 7 8 9 10 11 12 13 14 다음 728x90 반응형