사용자가 데이터 다중 선택을 할 수 있도록 여러 옵션을 체크박스 형태로 제공하는 컴포넌트이다.

( 참고: https://ionsdp.atlassian.net/wiki/spaces/ICE4P/pages/1543733287/Input+Component#Common-options )

Basic UI

체크박스의 기본 UI는 다음과 같다. 상단 라벨은 Hidden Label 옵션을 사용하여 숨김 처리 할 수 있으며, Disable 옵션을 설정하여 체크박스를 비활성화 할 수 있다.

...

...

Function

1. Active First Value

미리 셋팅 된 데이터 목록에서 첫 번째 값을 Default로 설정 할 수 있다.

...

2. Show Check All

전체 선택 기능의 체크박스를 옵션으로 추가 할 수 있다.

...

3. Max Item Count

체크 박스 선택 Max 값을 설정 할 수 있다.

...

4. Exclude Items

이미 셋팅 해 놓은 데이터 선택 목록에서 제외하고 싶은 데이터가 있다면 Exclude Items 옵션에서 아래와 같이 직접 선택하여 제외 시킬 수 있다.

...

5. Use Grid

그리드 옵션을 사용하여 체크박스 옵션을 나열 할 수 있다.

...

6. Addon Multiple Component Type

...

선택한 데이터를 컴포넌트로 체크박스 영역 하단에 목록으로 출력하는 기능을 제공한다.

• Addon Multiple Component Type : 컴포넌트 타입(Sortable, List, Grid)

  • Draggable : Sortable 타입일 경우 사용 가능한 드래그앤 드랍 정렬 기능

  • Grid Column Count : Grid 타입일 경우 사용 가능한 그리드 컬런 카운트 기능

  • Show Order : 체크박스에서 선택한 순서를 Order로 표시

  • Show Actions : 액션 버튼 기능 옵션

    • Show Actions Delete Button

    • Show Actions View Button

사용자가 데이터를 선택한 순서대로 목록에 리스트업 되며, Sortable 타입으로 옵션을 설정할 경우 선택한 데이터 순번(Order)을 변경 할 수 있다. 추가적으로 Drag Sort 옵션을 사용하여 사용자가 드래그앤드랍 정렬을 할 수 있도록 할 수 있다.

Status
colour Blue title ex

Type{ Sortable }, Draggable{ON}, Show Order{ON}

...