[Thymeleaf] th:check DB 값에 따라 체크하기

# 문제상황

 

문제는 searchDto 안에 있는 ConstructionType 의 값에 따라 Enum 반복문으로 돌린 체크박스를

경우에 따라 체크하고 싶다는 것이다.

 

<label th:each="cStyle, status : ${constructionStyleType}" id="constructionTypeBox" 
th:with="isExist = ${search.constructionStyle != null}">
	<input type="checkbox" class="checkElement" name="constructionStyle" 
    th:id="${cStyle}" th:value="${cStyle}" 
    th:checked="${isExist and (search.constructionStyle == cStyle)}">
    
	<label th:for="${cStyle}" th:text="${cStyle}"></label>
</label>

되게 복잡한 코드다.. ㅠㅠ Enum을 활용해서 반복문으로 돌리고, Search 객체에서 받아온 데이터랑

비교해서 동일하면 check 를 하게끔 단순한 것을 짜려고 했지만.. 어째서인지 되지 않는다.

 

 

---

 

# 답

- search.constructionStyle 과 cStyle 은 == 연산자나 eq 로 비교 불가하지만,

  search.constructionStyle 과 cStyle.toString() 값은 스트링 값으로 비교 가능하다는 걸 알아냈다.

  문제 상황에서 search.constructionStyle 과 cStyle 의 비교가 안됐는데, 위의 값으로 비교가 가능했다.

  그리고, 체크박스를 중복체크할 시 Value1,Value2,Value3 의 형태로  나와 eq 나 == 로 비교 불가하였지만

  contains 메소드를 활용해서 이 문제를 해결했다.

 

th:checked="${isExist and (#strings.contains(search.constructionStyle,cStyle.toString()))}"

 

 

---

# 해결과정

 

1) search.constructionStyle 값이 null 이 아닐 때

th:checked="isExist"

  이건 정상 작동됨. OK

  isExist 처럼 Null 값 처리를 안해주면, Null 값일 때 toString 못한다고 에러가 남..

 

 

2) search.constructionStyle 이 null 값이 아니고, Organic 일 때

th:checked="${isExist and (search.constructionStyle == 'Organic')}"

  null 값일 때는 체크가 안되는데, Organic 일 땐, cStyle 의 값이 모두 체크가 됨

 

 

3) search.constructionStyle 이 null 값이 아니고, cStyle 이 Organic일 때,

th:checked="${isExist and (cStyle == 'Organic')}"

  이건 모두 체크가 안됨.

 

 

 

일단 내가 의심하는 것은 객체와 String 값이라 타입이 안맞아서 일까 의심하는 중이다.

search.constructionStyle 과 cStyle 을 그대로 th:text 로 뽑을 때는 동일하게 뽑힌다.

(즉, 선택한 애들이 뽑힘, 단 search.constructionStyle 은 중복 선택 시 ,형태로 뽑힘)

 

근데 왜 모두 체크가 되냐고..

 

 

 

 

4) 이번엔 null 값이 아니면, Organic 을 가진 애는 무조건 체크하도록 설정했다.

th:checked="${isExist and (cStyle.toString() == 'Organic')}"

  이건 정상 작동됨

 

5) 이번엔 search.constructionStyle 이 Organic 일 때 모두 체크하도록 설정했다.

th:checked="${isExist and (search.constructionStyle == 'Organic')}">

  이건 정상 작동됨

 

즉, search.constructionStyle 과 cStyle.toString() 값은 스트링 값으로 비교 가능하다는 걸 의미한다.

 

 

6) 비교 가능한 두 변수가 동일하면 체크하도록 했다.

th:checked="${isExist and (search.constructionStyle == cStyle.toString())}"

  정상작동

 

 

역시,, 2시간 동안 머리로만 하면 해결 절대 안되던게,, 쓰면서 하니까 10분안에 해결됐다.

그러나 아직 다음 단계가 남아있다.

중복 선택을 할 시, Organic,Trendy 의 형태로 ,가 붙게 된다. 이건 eq 나 == 가 아닌

포함의 관계가 되거나, 일일이 짤라서 반복문으로 다시 넣어줘야 할지 모른다.

 

그럼 eq 말고 다른게 있나 볼까..

 

'!=', '%', '&&', '(', ')', '*', '+', '+=', ',', '', '.', '/', <, <=, , '==', '>', '>=', '?', '?.', '?:', and, div, eq, ge, gt, le, lt, mod, ne, or, '||' or '}' expected, got '='

 

이 표현식에서는 간단한 연산이나 비교 밖에 없었고, #string 메소드를 활용해서 포함 메소드를 만들었다.

th:checked="${isExist and (#strings.contains(search.constructionStyle,cStyle.toString()))}"

  성공

 

 

 

 

---

 

# 참조

- 타임리프 표현식 참조

http://blog.naver.com/PostView.nhn?blogId=specialnks&logNo=221313625420&parentCategoryNo=&categoryNo=4&viewDate=&isShowPopularPosts=true&from=search

thymeleaf eaxmple 예제

- 타임리프 표현식 참조 2

http://progtrend.blogspot.com/2019/05/thymeleaf.html

Thymeleaf 간단 매뉴얼

 

- #string 관련 메소드 참조

https://cizz3007.github.io/%ED%83%80%EC%9E%84%EB%A6%AC%ED%94%84/syntax/thymeleaf/2018/04/10/thymeleaf2/

thymeleaf 문법