타임리프(Thymeleaf)에서 프래그먼트에 자바스크립트 함수 전달하기

2024-07-15 타임리프(Thymeleaf)는 서버 사이드 템플릿 엔진으로, HTML을 템플릿으로 사용하여 동적 웹 페이지를 생성하는 데 유용합니다. 때로는 자바스크립트 함수를 프래그먼트에 직접 전달해야 할 때가 있습니다. 이 글에서는 타임리프에서 프래그먼트에 자바스크립트 함수를 전달하는 방법을 설명합니다.1. 프래그먼트 정의하기먼저, 자바스크립트 함수를 호출할 수 있도록 프래그먼트를 정의합니다. 프래그먼트는 th:fragment 속성을 사용하여 정의할 수 있습니다.  2. 프래그먼트 호출하기타임리프 문법을 사용하여 프래그먼트를 호출할 때, 자바스크립트 함수와 매개변수를 문자열로 전달합니다. 3. 자바스크립트 함수 정의하기마지막으로, 호출하려는 ..

• format_list_bulleted WEB/Thymeleaf
• · 2024. 7. 15.
• textsms

thymeleaf 에서 th:fragment 에 매개변수 넣는법

2024-03-06 1. 방법 th:frgment를 호출할 th:replace 파트 호출할 th:frgment 이름 뒤에 괄호를 붙인뒤(매개변수명=${백엔드에서 넘긴 변수}) 를 같이 전달하면 th:frgment에 th:frgment 부분 th:frgment에서는 value1 is a value1 is b 메인 이미지 출처 : 사진: Unsplash의Pavel Golasowski

• format_list_bulleted WEB/Thymeleaf
• · 2024. 3. 6.
• textsms

jar 파일 배포시 Thymeleaf 리소스 못찾는 문제 해결 방법

2024-02-21 1. 방법 application.properties 에 설정해 둔 경로 확인 # Thymeleaf spring.thymeleaf.enabled=true spring.thymeleaf.prefix=classpath:/templates/ spring.thymeleaf.suffix=.html spring.thymeleaf.mode=HTML spring.thymeleaf.encoding=UTF-8 #spring.thymeleaf.cache=false return 경로가 "/home/home" 이런식으로 되어 있으면 경로 못 찾음 spring.thymeleaf.prefix=classpath:/templates/ 에서 이미 / 를 붙여 주었으니 아래와 같이 되어 있는지 확인 @GetMapping..

• format_list_bulleted WEB/Thymeleaf
• · 2024. 2. 21.
• textsms

[Thymeleaf] 타임리프 lottie json 형식으로 불러오기

2023-12-18 1. 방법 CDN 으로 자바스크립트 코드 소스를 불러온다. lottie-player 태그를 이용해 자신의 json 파일을 불러오면 된다. 아래는 참고용 위치이다. 전체코드 template 메인 이미지 출처 : 사진: Unsplash의Austin Schmid

• format_list_bulleted WEB/Thymeleaf
• · 2023. 12. 18.
• textsms

[Thymeleaf] 타임리프 변수 자바스크립트에서 사용하는법

2023-01-22 1.방법 우선 script 태그 안에 아래의 내용을 삽입한다. th:inline="javascript" 다음은 변수를 사용하고자 하는 함수를 아래와 같이 cdata 형식으로 묶어준다. /* /*]]>*/ 마지막으로 request 객체에 담은 변수를 [[${ }]] 형식으로 담아 사용하면 된다. var regex =[[${regexAllPermit}]]; 아래는 전체 예제 코드이다. 메인 이미지 출처 : 사진: Unsplash의Tianhao Wang

• format_list_bulleted WEB/Thymeleaf
• · 2023. 1. 22.
• textsms

[Thymeleaf] th:text 안에 문자 합치기 / 파라미터 여러개 넣기

2023-01-02 1. 방법 아래와 같이 | 구분자를 쌍 따옴표 안의 시작점과 끝점에 두면 여러 파라미터를 받아 th:text 안에 넣을 수 있다. //dto 형식의 파라미터의 경우 //단순 파라미터의 경우 메인 이미지 출처 : Photo by Sam Goodgame on Unsplash

• format_list_bulleted WEB/Thymeleaf
• · 2023. 1. 2.
• textsms