참고 URL :https://qiita.com/rubytomato@github/items/ac65c2203d16d1a1bbd7
데이터 전송 :
https://www.leafcats.com/30
https://hyunsangwon93.tistory.com/19
데이터 출력 :
https://snoop-study.tistory.com/48
https://eblo.tistory.com/55
https://cyberx.tistory.com/132
https://ttallaemideul.github.io/20200318/thymeleaf-js-001
자바스크립트에서 사용 :
https://easybrother0103.tistory.com/2
https://cyberx.tistory.com/160
- xmlns:th="http://www.w3.org/1999/xhtml"
XHTML 문서를 위한 XML 네임스페이스를 명시하는 것으로, 생략해도 정상동작합니다.
IntelliJ에서 thymeleaf 문법 사용 시, 문법 에러가 발생하여 추가하였습니다.
참고 URL : http://tcpschool.com/html-tag-attrs/html-xmlns
- th:insert
헤더와 푸터처럼 다른 페이지를 현재 페이지에 삽입하는 역할을 합니다.
JSP의 include와 같습니다.
참고 URL : https://www.thymeleaf.org/doc/articles/layouts.html
- th:href
thymeleaf에서 html 속성은 대부분 이처럼 th: 으로 바꿔서 사용할 수 있습니다.
@{ } 의 의미는 애플리케이션이 설치된 경로를 기준으로 하는 상대경로 입니다.
예제에서 @{/post}는 URL이 http://localhost:8080/post 가 되겠네요.
참고 URL : https://www.thymeleaf.org/doc/articles/standardurlsyntax.html##context-relative-urls
* 예시
=================================================================================================================
<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>If Buy...껄껄껄</title>
</head>
<body>
<!--HEADER-->
<div th:insert ="common/header.html" id="header"></div>
<a th:href="@{/post}">글작성</a>
<!--FOOTER-->
<div th:insert="common/footer.html" id="footer"></div>
</body>
</html>
=================================================================================================================
https://wonjinism.tistory.com/17
모델(model)을 사용하여 전송,
아래는 예시로 작성하였음
=====================================================================================================================================================
/*
* 로그인
* @param AdminVO
* @return boolean
* */
@PostMapping(“/”)
public String loginCheck(AdminVo adminVo, HttpServletRequest httpServletRequest, Model model){
boolean loginCheck = mainService.loginCheck(adminVo);
if(loginCheck){
HttpSession session = httpServletRequest.getSession();
session.setAttribute("loginCheck","success");
return "main/main.html";
}
log.info("####Controller.loginCheck : {}",loginCheck );
model.addAttribute("loginFail","로그인이 실패하였습니다. ID / PW 를 확인해주세요");
return "login/login.html";
}
=====================================================================================================================================================
세션에 있는 데이터는 ${session.loginUser} 로 꺼내서 쓰면됨,
session 은 따로 설정하는게 아니며 선언이 이미 되어 있는듯,
. 뒤에는 세션에 저장한 변수명
=====================================================================================================================================================
<p th:text="${session.loginUser}"> </p> 으로 사용하면 됨,
=====================================================================================================================================================
th 문법은 다양하며 필요할때마다 찾아서 사용하면 됨
=====================================================================================================================================================
<p th:text="${변수명}"> </p> 으로 사용하면 됨,
또는
[[${user.name}]] 로 사용하면 됨
=====================================================================================================================================================
스크립트 선언부분에 th:inline="javascript" 추가
변수 사용부분을 아래와 같이 CDATA 로 묶어서 사용
또는 [[${loginFail}]]; 처럼 곧바로 사용이 가능
=====================================================================================================================================================
<script th:inline="javascript">
$(document).ready(function(){
/*<![CDATA[*/
var result = /*[[ ${test} ]]*/;
/*]]*/
alert(result);
var aa = [[${loginFail}]];
=====================================================================================================================================================
URL : https://webisfree.com/2020-01-03/%EC%9E%90%EB%B0%94-%ED%85%9C%ED%94%8C%EB%A6%BF-thymeleaf%EC%97%90%EC%84%9C-html-%ED%8C%8C%EC%9D%BC-%EC%B6%94%EA%B0%80%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95-%EB%B0%8F-%EC%98%88%EC%A0%9C