@ModelAttribute 관련 static 처리와 th:fie... - 인프런

스프링 MVC 2편 - 백엔드 웹 개발 활용 기술

체크 박스 - 멀티

@ModelAttribute 관련 static 처리와 th:field 부분 질문드립니다

해결된 질문

작성

411

[질문 내용]
안녕하십니까 강의 정말 잘 듣고 있습니다. 두 가지 질문 드리려고 하는데요!

5분 50초 경에

@ModelAttribute("regions")
public Map<String, String> regions() {
Map<String, String> regions = new LinkedHashMap<>();
regions.put("SEOUL", "서울");
..
return regions;
} 부분 설명해주시면서 별도의 메서드마다 별도로 처리하는 것보다는 static으로 처리를 하면 더 좋다는 설명을 해주셨습니다. static으로 처리하는 것의 예시가 궁금합니다. 어떻게 처리를 해야할지 감이 잘 안와서요!! ㅎㅎ ㅠ
```
         <input type="checkbox" th:field="*{regions}" th:value="${region.key}"
 class="form-check-input">
```
th:field="*{regions}" 와 th:value="${region.key}" 의 값을 비교해서 checked 설정을 해준다는 설명 부분이 이해가 잘안갑니다..ㅠ th:field="*{regions}" 를 적용했을 때 id 값과 name값 value값을 편리하게 설정해준다는 개념만 이해가 되는데 사용자가 항목을 체크하면 th:field="*{reigons}" 에 어떤 값들이 들어가는것인지 , 어떻게 비교를 하는 것인지 잘 모르겠습니다...

감사합니다..!

spring mvc

답변 1

김영한

지식공유자

안녕하세요. s2사랑해요s2김영한s2님 🙂

다음과 같이 처리하시면 됩니다.

public abstract class Regions {

    private static final Map<String, String> regions = new LinkedHashMap<>();
    static {
        regions.put("SEOUL", "서울");
        regions.put("BUSAN", "부산");
        regions.put("JEJU", "제주");
    }

    public static Map<String, String> getRegions() {
        return regions;
    }


}

//컨트롤러
@ModelAttribute("regions")
public Map<String, String> regions() {
    return Regions.getRegions();
}

관련 코드가 잘 이해되지 않으면 자바의 static에 대해서 학습하셔야 합니다.

2번의 경우 다음 코드를 통해서 생성된 코드를 웹브라우저에서 소스코드 보기를 해보시면 확인할 수 있습니다.

<input type="checkbox" th:field="*{regions}" th:value="${region.key}"
 class="form-check-input">

생성된 코드

        <!-- multi checkbox -->
        <div>
            <div>등록 지역</div>
            <div class="form-check form-check-inline">
                <input type="checkbox" value="SEOUL" class="form-check-input" id="regions1" name="regions" checked="checked"><input type="hidden" name="_regions" value="on"/>
                <label for="regions1"
                       class="form-check-label">서울</label>
            </div>

            <div class="form-check form-check-inline">
                <input type="checkbox" value="BUSAN" class="form-check-input" id="regions2" name="regions"><input type="hidden" name="_regions" value="on"/>
                <label for="regions2"
                       class="form-check-label">부산</label>
            </div>

            <div class="form-check form-check-inline">
                <input type="checkbox" value="JEJU" class="form-check-input" id="regions3" name="regions"><input type="hidden" name="_regions" value="on"/>
                <label for="regions3"
                       class="form-check-label">제주</label>
            </div>
        </div>

th:field="*{regions}"

이 코드는 Item에 있는 regions를 사용합니다.

public class Item {

    private Long id;
    private String itemName;
    private Integer price;
    private Integer quantity;

    private Boolean open; //판매 여부
    private List<String> regions; //등록 지역
}

th:value="${region.key}"

이 코드는 타임리프에서 해당 코드 바로 위에서 반복하는 <div th:each="region : ${regions}">에 있는 region을 뜻합니다. 즉 다음 코드를 뜻합니다.

    @ModelAttribute("regions")
    public Map<String, String> regions() {
        Map<String, String> regions = new LinkedHashMap<>();
        regions.put("SEOUL", "서울");
        regions.put("BUSAN", "부산");
        regions.put("JEJU", "제주");
        return regions;
    }

결과적으로 @ModelAttribute에서 다음 regions가 반복하면서 출력됩니다.

그 중에 Item.regions의 값과, @ModelAttribute에 있는 regions에 있는 key가 같으면 HTML에서 checked가 들어갑니다. 화면에는 체크 표기가 되어 보이는 것이지요.

감사합니다.

s2사랑해요s2김영한s2

질문자

자세한 설명 진심으로 감사드립니다. 1번은 정말 잘 이해가 되었습니다!!

2번 질문에서 추가로 질문드리고 싶은데..

th:field="*{regions}" 이 값이 item에 있는 regions를 사용한다는 것을 알고,

th:value="${region.key}" 이 코드는 <div th:each="region : ${regions}">에 있는 region을 뜻하는 것도 알겠습니다.

그런데 둘을 비교하는 부분이 이해가 가질 않습니다 강사님!! TT

사용자가 체크박스 항목을 체크를 하면 items에 있는 regions에 값이 들어가고 이 값과 모델에 들어있는 regions 값을 비교해서 checked 속성이 checked로 바뀌는 것인가요?

김영한

지식공유자

네 생각하신 내용이 맞습니다^^!

인프런 커뮤니티 질문&답변

@ModelAttribute 관련 static 처리와 th:field 부분 질문드립니다