WebMaster

타임리프를 사용해서 폼에서 체크박스, 라디오 버튼, 셀렉트 박스를 편리하게 사용하는 방법을 학습 요구사항 추가 판매 여부 판매 오픈 여부 체크 박스로 선택할 수 있다 등록 지역 서울, 부산, 제주 체크 박스로 다중 선택할 수 있다. 상품 종류 도서, 식품, 기타 라디오 버튼으로 하나만 선택할 수 있다. 배송 방식 빠른 배송 일반 배송 느린 배송 셀렉트 박스로 하나만 선택할 수 있다 ItemType (Enum) public enum ItemType { BOOK("도서"), FOOD("음식"), ETC("기타"); private final String description; ItemType(String description){ this.description = description; } public Stri..

th:object = 커맨드 객체를 지정 *{...} = 선택 변수 식, th:object에서 선택한 객체에 접근한다. th:field = HTML 태그의 id, name, value 속성을 자동으로 처리한다 AddForm 수정 @GetMapping("/add") public String addForm(Model model) { model.addAttribute("item", new Item()); //빈 모델이라도 넘겨주어야 한다 return "form/addForm"; } 빈 객체라도 모델로 넘겨야 하기 때문에 addForm 메서드에서 빈객체를 넘겨준다. AddForm, EditForm HTML 수정 AddForm 수정 상품명 가격 수량 상품 등록 취소 editForm 수정 상품 ID 상품명 가격 수..

기본 매뉴얼: https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html Tutorial: Using Thymeleaf 1 Introducing Thymeleaf 1.1 What is Thymeleaf? Thymeleaf is a modern server-side Java template engine for both web and standalone environments, capable of processing HTML, XML, JavaScript, CSS and even plain text. The main goal of Thymeleaf is to provide a www.thymeleaf.org 스프링 통합 매뉴얼: https://www.t..

@GetMapping("/layout") public String layout(){ return "template/layout/layoutMain"; } 메인 컨텐츠 common_header(~{::title},~{::link}) ::title 은 현재 페이지의 title 태그들을 전달한다. ::link는 현재 페이지의 link 태그들을 전달한다. 메인 타이틀이 전달한 부분으로 교체되었다. 공통 부분은 그대로 유지되고, 추가 부분에 전달한 들이 포함된 것을 확인할 수 있다. 레이아웃 개념을 두고, 그 레이아웃에 필요한 코드 조각을 전달해서 완성하는 것 @GetMapping("/layoutExtend") public String layoutExtend(){ return "template/layoutExte..

@Controller @RequestMapping("/template") public class TemplateController { @GetMapping("/fragment") public String template(){ return "template/fragment/fragmentMain"; } } 부분 포함 부분 포함 insert 부분 포함 replace 부분 포함 단순 표현식 파라미터 사용 푸터 자리 입니다. 파라미터 자리 입니다. 부분 포함 Insert 현재 태그(div) 내부에 추가를 한다 부분 포함 replace 현재 태그(div)를 대체한다. 부분 포함 단순 표현식 ~{..}를 사용하는 것이 원칙이지만 코드가 단순하면 생략이 가능하다 파라미터 사용 파라미터를 전달하여 동적으로 조각 레터링..

@GetMapping("/javascript") public String javascript(Model model){ model.addAttribute("user", new User("userA\"A\"", 10)); addUsers(model); return "basic/javascript"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("userA", 10)); list.add(new User("userB", 20)); list.add(new User("userC", 30)); model.addAttribute("users", list); } 텍스트 렌더링 var username = [[${us..

@GetMapping("/block") public String block(Model model){ addUsers(model); return "basic/block"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("userA", 10)); list.add(new User("userB", 20)); list.add(new User("userC", 30)); model.addAttribute("users", list); } 사용자 이름1 사용자 나이1 요약 Block으로 여러 개의 태그를 묶어서 무엇인가를 같이 적용시키고 싶을 때 block을 사용한다. 은 렌더링시 제거된다.

@GetMapping("/comments") public String comments(Model model){ model.addAttribute("data", "Spring!"); return "basic/comments"; } 예시 html data 1. 표준 HTML 주석 2. 타임리프 파서 주석 html data 3. 타임리프 프로토타입 주석 표준 HTML 주석 자바스크립트의 표준 HTML 주석은 타임리프가 렌더링 하지 않고, 그대로 남겨둔다. 타임리프 파서 주석 타임리프 파서 주석은 타임리프의 진짜 주석이다. 렌더링에서 주석 부분을 제거한다. 타임리프 프로토타입 주석 타임리프 프로토타입은 약간 특이한데, HTML 주석에 약간의 구문을 더했다. HTML 파일을 웹 브라우저에서 그대로 열어보면 HTM..

@GetMapping("/condition") public String condition(Model model){ addUsers(model); return "basic/condition"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("userA", 10)); list.add(new User("userB", 20)); list.add(new User("userC", 30)); model.addAttribute("users", list); } if, unless count username age 1 username 0 switch count username age 1 username 10살 20살 ..

@GetMapping("/each") public String each(Model model){ addUsers(model); return "basic/each"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("userA", 10)); list.add(new User("userB", 20)); list.add(new User("userC", 30)); model.addAttribute("users", list); } 속성 설정 속성 추가 - th:attrappend = - th:attrprepend = - th:classappend = checked 처리 - checked o - checked x ..