웹프로그램 연구(XI) Input.checkbox와 리스트

상태의 토글: input.checkbox 의 용도로는 한개의 필드가 0/1의 값으로 양자택일의 상태를 나타내는 데 적합하다. 하지만 체크상태가 아닐 경우에는 form.submit 에서 쿼리에 포함되지 않기 때문에 비표시 태그를 써서 쿼리를 송신하는 방법을 고안하였다.
참고: 웹프로그램 연구(VIII) Input.checkbox의 송신방법

복수 선택 목록

체크박스, input.checkbox 는 하나의 필드를 나타내기 위해서도 사용하지만 여러 선택항목을 나타내기 위해서도 자주 사용된다. 보통 체크리스트박스, CheckListBox 라고 부르는 컴포넌트를 웹 페이지로 구현하고자 하는 것이다.예를 들면,

First check
Second check
Third check
Fourth check
Fifth check

가령 한개의 필드에 이러한 선택사항을 저장하고자 한다면 fieldname = "1, 3, 5"으로 저장하면 될 것이고 체크된 항목을 묶어서 필드에 저장하면 충분하다. 이때는 미체크된 항목을 굳이 쿼리에 송신할 필요가 없다.

<label> <input value="1" type="checkbox" name=item[]>First check</label><br>
<label> <input value="2" type="checkbox" name=item[]>Second check</label><br>
<label> <input value="3" type="checkbox" name=item[]>Third check</label><br>
<label> <input value="4" type="checkbox" name=item[]>Fourth check</label><br>
<label> <input value="5" type="checkbox" name=item[]>Fifth check</label><br>

이렇게함으로 item[]배열에 들어있는 요소를 추출함으로 fieldname에 내용을 다 넣어줄 수 있게 된다.

디폴트를 넣는 개선

한편 전 항목을 선택하지 않은 경우에는 item[]이 하나도 쿼리에 송신되지 않으므로 최소한의 더미 요소를 추가해 두고 비표시로 두어야 한다. 하나도 없는 경우의 값을 넣어두고 보면 쿼리가 송신된다.

<input value="null" type="hidden" name=item[]>

상태와 복수 선택 목록을 통합

그러면 두가지를 모두 한가지 로직으로 서버측 스크립트로 구성하려면 어떻게 하면 옳은가? 상태의 토글을 처리하기 위해서 첫번째 배열 요소를 사용하는 구현을 사용하였다. 이 구현을 확장하는 의미에서 두가지를 통합하려면 복수 선택 목록, CheckListBox를 이차원 배열로 정의하는 것이다. 그러기 위해서는 하나의 키워드 식별자를 예약어로 사용하는 것이 필요하다.

<input value="null" type="hidden" name=item[CHECKLIST][]>
<input value="1" type="checkbox" name=item[CHECKLIST][]>

이제CHECKLIST라는 이차원 배열이면 배열 요소를 php:implode()등을 사용하여 묶어 두면 된다.

CheckListBox 의 개선

CheckListBox를 이차원 배열로 정의하는 것은 다소 알아보기 어려운 면이 있다. 그래서 주의깊게 보면 상태의 토글은 비표시 요소를 뒤에 배치하고 복수목록은 비표시 목록을 앞에 두는 것으로 차이를 구별하는 것이 가능하다.

<input value="null" type="hidden" name=item[]>
<input value="1" type="checkbox" name=item[]>

이제CHECKLIST라는 배열 요소의 첫번째 값이 null이면 이는 CheckListBox가 되고 null이 아닌 값이면 토글박스라고 판단가능하다.