타임리프 스프링 통합

 <form action="item.html" th:action th:object="${item}" method="post">
        <div>
            <label for="itemName">상품명</label>
            <input type="text"  th:field="*{itemName}" class="form-control" placeholder="이름을 입력하세요">
        </div>

th:object="{item}" : form에서 사용할 객체를 지정
th:field="*{itemName}"
- 선택변수식 *{itemName} == ${item.itemName}
- th:field는 id, name, value 속성을 자동으로 생성

체크박스
#

logging.level.org.apache.coyote.http11=debug 서버에서 http 요청 메시지를 볼 수 있다.

체크 박스를 선택하면, Form에서 open=on 값이 넘어간다. 스프링이 이를 true로 반환한다.

** 주의 ** 선택하지 않는다면 open 필드 자체가 전송되지 않는다 (null) 수정시 문제될수도있음

이를 해결하기 위해, 히든 필드를 하나 만들어서 해결한다 _open처럼 기존 이름 앞에 _를 붙여서 전송하면 해제했다고 인식 (스프링지원기능) 만일 open이 들어온다면 _open은 무시

타임리프 활용
#

위처럼 개발할 때마다 히든 필드를 추가하는건 상당히 번거로움 th:field 를 사용하면, 저절로 히든 필드를 추가해줌 또 조회시 checked 속성을 자동으로 넣어줌

체크박스 멀티
#

@ModelAttribute('이름') 메소드 레벨 해당 컨트롤러가 호출이 되면, 자동으로 모델에 리턴값 담아줌

 @ModelAttribute("region")
    public Map<String, String> regions(){
        Map<String,String> regions = new LinkedHashMap<>();
        regions.put("SEOUL","서울");
        regions.put("BUSAN","부산");
        regions.put("JEJU","제주");
        return regions ;
    }
    //이게 선언된 컨트롤러에선, 모델에 무조건 regions가 담기게 된다
    //자동으로 model.addAttribute("regions",regions")
    //*이걸통해 타임리프에서 반복으로 생성*

th:for="(#ids.prev('open')} 반복해서 멀티 체크박스를 만들 때, ID는 유일해야하므로 타임리프는 루푸 안에서 1,2,3등의 숫자를 붙여준다. 따라서 ids.prev(...),ids.next(...)를 사용해 동적으로 제공되는 ID를 사용한다.

조회시 타임리프는th:field에 지정한 값과 th:value에 지정된 값을 비교해서 자동으로 처리해준다

<div>등록 지역</div>
 	<div th:each="region : ${regions}" class="form-check form-check-inline">
        <input type="checkbox" th:field="${item.regions}" th:value="${region.key}" class="form-check-input">
        <label th:for="${#ids.prev('regions')}"
                       th:text="${region.value}" class="form-check-label">서울</label>
	</div>
</div>