Spring
-
Spring MVC - 타임리프(Thymeleaf)을 사용한 Radio button(라디오 버튼)Spring/Spring MVC 2022. 2. 4. 16:39
타임리프(Thymeleaf)을 사용한 Radio button(라디오 버튼) 라디오 버튼은 여러 선택지 중에 하나를 선택할 때 사용할 수 있다. 자바 Enum을 활용해서 라디오 버튼을 사용해 보자 public enum ItemType { BOOK("도서"), FOOD("식품"), ETC("기타"); private final String description; ItemType(String description) { this.description = description; } public String getDescription() { return description; } } Radio Button을 설명하기위해 생성한 Enum 클래스 @ModelAttribute("itemTypes") public ItemT..
-
Spring MVC - 타임리프(Thymeleaf)을 사용한 multi checkbox(멀티 체크박스)Spring/Spring MVC 2022. 2. 4. 16:08
타임리프(Thymeleaf)를 사용한 multi checkbox 위 이미지와 같이 checkbox를 1개 이상 사용하는 멀티 checkbox를 어떻게 사용하는지에 대해 알아보자. @ModelAttribute("regions") public Map regions(){ Map regions = new LinkedHashMap(); regions.put("SEOUL", "서울"); regions.put("BUSAN", "부산"); regions.put("JEJU", "제주"); return regions; } 컨트롤이 호출할 때마다 자동으로 실행되어 Model에 return 된 객체를 담아준다. 호출되는 컨트롤러 내부에 작성 multi checkbox를 설명하기위해 작성한 코드로 좋은 방법은 아니다. th:e..
-
Spring MVC - 타임리프(Thymeleaf)을 사용한 단일 checkboxSpring/Spring MVC 2022. 2. 4. 14:38
단일 체크 박스를 타임리프로 사용하기 전에 기본적인 단일 체크 박스가 스프링에서 어떻게 동작하는지 알아보자 판매 여부 판매 오픈 form 안에 위 코드를 삽입하여 값이 잘 넘어오는지 logging을 통해 확인해보면 다음과 같다. checkbox를 체크하면 HTML Form에서 open=on 이라는 값이 넘어간다. 스프링은 이 on이라는 문자를 Boolean 데이터 타입인 true 값으로 자동 변환해준다. 그런데 checkbox를 체크하지 않으면 HTML Form은 open이라는 필드 자체를 서버로 전송은 하지 않아 logging으로 확인해보면 null값인 것을 확인할 수 있다. 여기서 문제가 발생하는데 만약 수정 Form에서 checkbox가 체크가 되어있는 것을 체크 해제하고 수정했을 시 checkbo..
-
Spring MVC - 타임리프(Thymeleaf)를 이용한 입력 폼(Form) 사용법Spring/Spring MVC 2022. 2. 4. 12:13
타임리프(Thymeleaf)를 이용한 입력 폼(Form) 사용법 th:object - 커멘드 객체를 지정하여 Form에서 사용 *{ ... } - 선택 변수식이라고 한다. th:object 에서 선택한 객체를 편리하게 프로퍼티 접근법을 이용할 수 있다. th:field - HTML 태그의 id, name, value 속성을 자동으로 처리해 준다. 등록 form 사용 예시 th:action - 값을 안 넣어주면 같은 URL에 POST 메서드 방식으로 요청한다. th:object="${item}" - request 영역에 저장되어있는 item 객체를 가져온다 - 해당 폼에서 item 객체 사용 가능 th:field="*{itemName}" - 선택 변수 식이라고 한다. th:object에서 선택한 객체 프로..
-
Spring MVC - 타임리프(Thymeleaf) 템플릿 조각과 레이아웃 (th:fragment, th:insert, th:replace)Spring/Spring MVC 2022. 2. 3. 14:25
타임리프(Thymeleaf) 템플릿 조각과 레이아웃 웹 페이지를 개발할 때는 공통 영역이 많이 들어있다. 예를 들어 상단 메뉴, 하단 홈페이지 정보, 좌측 카테고리 등 여러 페이지에서 공통으로 사용하는 영역들이 있다. 이런 공통 영역 부분들을 페이지마다 코드 작성을 하면 코드 중복이 일어나고, 수정을 하면 공통 영역을 사용하는 모든 페이지를 각각 수정해야 하는 번거로움이 생긴다. 타임리프는 이러한 문제를 해결하기 위해 템플릿 조각과 레이아웃 기능을 지원한다. 타임리프(Thymeleaf) 템플릿 조각 일부 코드를 가져와서 사용하는 방법이다. 템플릿 조각을 이용하기 위해 footer.html 파일을 우선 만들어 준다. 푸터 자리 입니다. 파라미터 자리 입니다. 해당 태그들은 다른 HTML 파일에서 th:in..
-
Spring MVC - 타임리프(Thymeleaf) 블록과 자바스크립트 인라인Spring/Spring MVC 2022. 2. 3. 11:25
타임리프(Thymeleaf) 블록 타임리프의 특성상 HTML 태그 안에 기능을 정의해서 사용하여 불편한 점이 있었다. 이러한 불편함을 해결하기 위해 타임리프는 th:block을 제공한다. 아래 코드를 보면 태그가 태그 2개를 감싸고 있다. 태그로 감싸주었기 때문에 첫번째 태그, 두번째 태그가 순서대로 반복문이 실행된다. 만약 태그로 감싸주지 않고 각각의 태그에 반복문을 넣으면 첫 번째 태그의 반복문이 끝나야 두번째 태그의 반복문이 실행되는 결과가 발생한다. User 객체가 3개 저장된 List 컬렉션의 반복 사용자 이름1 사용자 나이1 요약 서버를 가동시켜 웹브라우저에서 HTML의 소스 코드를 보면 다음과 같다. 사용자 이름1 userA 사용자 나이1 10 요약 userA / 10 사용자 이름1 user..
-
Spring MVC - 타임리프(Thymeleaf) 반복 기능(th:each), 조건부 기능(th:if, th:unless, th:switch)Spring/Spring MVC 2022. 2. 3. 10:29
타임리프(Thymeleaf) 반복 기능 타임리프에서 반복은 th:each를 사용하며 반복에서 사용할 수 있는 여러 상태 값을 지원한다. 반복 기능 th:each="변수 : 컬렉션" List, 배열, Iterable, Enumeration을 구현한 모든 객체를 반복에 사용 가능 Map의 경우는 Map.Entry가 변수에 담긴다. User 객체가 3개 저장된 List 컬렉션의 반복 username 0 서버를 가동시켜 웹브라우저에서 HTML의 소스 코드를 보면 다음과 같다. userA 10 userB 20 userC 30 반복 사용되는 여러 상태 값 th:each="변수, 상태변수 : 컬렉션" 자바의 for-each와 비슷하다 두 번째 파라미터를 설정하여 반복의 상태를 확인할 수 있다. 반복 상태를 나타내 주..
-
Spring MVC - 타임리프(Thymeleaf) 리터럴과 연산Spring/Spring MVC 2022. 2. 2. 21:26
리터럴 리터럴은 소스 코드상에서 고정된 값을 말한다. String a = "Hello" int a = 10 * 20 위 코드에서 "Hello"는 문자 리터럴, 10, 20은 숫자 리터럴이다. 타임리프 문자 리터럴 문자 리터럴 문자 리터럴은 항상 '(작은 따옴표)로 감싸야 한다. 공백 없는 문자 리터럴은 하나의 토큰으로 인지되어 작은 따옴표 생략 가능하다 "hello" -> 작은 따옴표 생략 가능, "hello world" -> 작은 따옴표 생략 불가능 'hello' + ' world!' = 'hello world!' = 'hello ' + ${data} = 서버를 가동시켜 웹브라우저에서 HTML의 소스 코드를 보면 다음과 같다. 'hello' + ' world!' = hello world! 'hello ..