전화번호, 사무실번호, 팩스번호를 기존에 input text 한 칸 이던 것을
dash(-) 기준으로 세 칸으로 나눠서 입력받아 달라는 요구사항이 들어왔다.
프런트 단 템플릿 엔진은 타임리프.... 경험이 거의 전무하다..
각각 번호는 이렇게 들어가 있다.
- 전화번호가 있으면 '-' 기준으로 input 칸이 세 칸으로 나뉘어야 한다.
- 공백인 데이터 or null 값인 데이터라면 공란의 세칸이 보여야 한다.
타임리프 생 초짜가 창피하지만 코딩한 결과는 이렇다.
* 사무실 전화번호 기준
<th scope="row">사무실전화번호</th>
<td th:if="${not #strings.isEmpty(user.office_phone)} ">
<input id="office_phone" style="display:none;" type="text" th:field="*{office_phone}" title="사무실 전화번호를 입력해주세요"/>
<input id = "office_phone1" style="width:30%" type="text" th:value="${#strings.arraySplit(user.office_phone,'-')[0]}" /> -
<input id = "office_phone2" style="width:30%" type="text" th:value="${#strings.arraySplit(user.office_phone,'-')[1]}" /> -
<input id = "office_phone3" style="width:30%" type="text" th:value="${#strings.arraySplit(user.office_phone,'-')[2]}" />
</td>
<td th:if="${user.office_phone == null or #strings.isEmpty(user.office_phone)}">
<input style="display:none;" type="text" th:field="*{office_phone}" title="사무실 전화번호를 입력해주세요" />
<input id = "office_phone1" style="width:30%" type="text" /> -
<input id = "office_phone2" style="width:30%" type="text" /> -
<input id = "office_phone3" style="width:30%" type="text" />
</td>
* 결과
* 어려웠던 부분
1. 타임리프 null 체크 구문이 쉬우면서도 어려웠다....
<td th:if="${not #strings.isEmpty(user.office_phone)} ">
<td>
<td th:if="${logodiTeacher.office_phone == null or #strings.isEmpty(user.office_phone)}">
</td>
':D > 공부해야할 것' 카테고리의 다른 글
| tomcat (0) | 2018.03.21 |
|---|---|
| maven 이용한 프로젝트 관리 방법 (0) | 2018.03.21 |
| 다중 스레드 (0) | 2015.01.10 |
| Migration(마이그레이션) (0) | 2014.12.22 |
