참고하기: https://getbootstrap.com/docs/4.0/components/breadcrumb/
실제로 이런 것을 사용하진 않았지만 폴더 구조를 표현하기 위해 비슷하게 표현하였음.
<div class="form-group col-md-3">
사이즈가 미듐일 때까지 3개의 컬럼을 유지하다가 , 그것보다 사이즈가 작아지면 전체 width가 작아지면 줄어들도록.. (bootstrap이 제공해줌)
package com.yuri.studyolle.event.form;
import com.yuri.studyolle.domain.EventType;
import lombok.Data;
import org.hibernate.validator.constraints.Length;
import org.springframework.format.annotation.DateTimeFormat;
import javax.validation.constraints.Min;
import javax.validation.constraints.NotBlank;
import java.time.LocalDateTime;
@Data //getter, setter 등등 ..
public class EventForm {
@NotBlank
@Length(max = 50) //최대 50글자까지
private String title;
private String description;
private EventType eventType = EventType.FCFS; //기본값으로 선착순을 선택함
@DateTimeFormat(iso = DateTimeFormat.ISO.DATE_TIME)
private LocalDateTime endEnrollmentDateTime; //언제까지 등록을 받을지
@DateTimeFormat(iso = DateTimeFormat.ISO.DATE_TIME)
private LocalDateTime startDateTime;
@DateTimeFormat(iso = DateTimeFormat.ISO.DATE_TIME)
private LocalDateTime endDateTime;
@Min(2)
private Integer limitOfEnrollments = 2; //최소인원 (2인 이상의 모임)
}
기본적으로 iso form을 사용하고 있다.
enum ISO {
/**
* The most common ISO Date Format {@code yyyy-MM-dd},
* e.g. "2000-10-31".
*/
DATE,
/**
* The most common ISO Time Format {@code HH:mm:ss.SSSXXX},
* e.g. "01:30:00.000-05:00".
*/
TIME,
/**
* The most common ISO DateTime Format {@code yyyy-MM-dd'T'HH:mm:ss.SSSXXX},
* e.g. "2000-10-31T01:30:00.000-05:00".
* <p>This is the default if no annotation value is specified.
*/
DATE_TIME,
/**
* Indicates that no ISO-based format pattern should be applied.
*/
NONE
}
뷰에서 선택한 날짜값들이 form 에 맞춰서 form 데이터로 들어오게 된다.
<select th:field="*{eventType}" class="custom-select mr-sm-2" id="eventType"
aria-describedby="eventTypeHelp">
<option th:value="FCFS">선착순</option>
<option th:value="CONFIRMATIVE">관리자 확인</option>
</select>
src/main/resources/templates/fragments.html 수정
한 화면에 여러개의 에디터인데 그 여러개에 다 적용해야 할 때는 id를 사용하기 힘들다. (id를 다 공유해야 하니까) 그래서 class를 적용, editor를 클래스로 가지고 있는 영역에다가 썸머노트를 적용하도록 함.
출처 : 인프런 백기선님의 스프링과 JPA 기반 웹 애플리케이션 개발