머털&보약의 기록

2가지 방법 존재 node.js 환경으로 구동(node.js 런타임 환경 필요, 서비스 구동 시 서버와 port 다르게 구성) 기존 thyemeleaf파일에 script만 추가(thyemelaf 렌더링 이후 조작하는 방식이라 node.js 불필요) 여기선 2번 째 방법 채택 기존 html의 body 태그안에 Vue.js 관련 script import(실제 배포 시엔 js파일 직접 import 권장) vue.js를 입힐 div root id 설정(예시) 주소록 사원명 검색 초기화 사원 목록 사원승인 신청 순번 사원명 직급 직책 전화번호 이메일 {{ item.no }} {{ item.empNm }} {{ item.positionCd }} {{ item.roleCd }} {{ item.empHp }} {{ i..

... //상세 팝업(2개의 매개변수를 받음) function annualViewPop(id, sno) { const width = 750; const height = 600; const left = (window.innerWidth - width) / 2; const top = (window.innerHeight - height) / 2; const popWindow = window.open("/viewPop?empId=" + id + "&annualSno=" + sno, "viewPop", "width=" + width + ", height=" + height + ", left=" + left + ", top=" + top); } 아래가 핵심 th:onclick="ViewPop([[${list.emp..

미래의 내가 보기 위해 javascript에서 thymeleaf값을 사용하는 방법을 기록한다. 코드로 대체한다. javascript(thymeleaf안의 script) // script에 th:inline 붙여야 함 controller @GetMapping("/list") public String list(Model model) { List list = userService.selectUserList(); model.addAttribute("list", list); return "view 페이지"; } reference: https://stackoverflow.com/questions/25687816/setting-up-a-javascript-variable-from-spring-model-by-usin..