Select Modal 컴포넌트는 Select 컴포넌트의 한 종류로, 선택 옵션을 Modal로 출력하여 사용자로 하여금 데이터의 상세 정보를 확인 한 뒤 선택 할 수 있도록 하는 것이다.
Basic UI
Select Modal의 기본 UI는 다음과 같다.
Function
1. Modal Render Type
Modal Render Type을 Page 또는 Components로 선택 할 수 있다. 예를 들어 Page를 선택했다면, 다음과 같이 모달로 연결하여 출력 할 페이지를 Modal Page 셀렉트 옵션에서 선택할 수 있다.
2. Modal Width
모달의 가로 길어를 퍼센트로 입력하여 설정 할 수 있다.
3. Value Type
Select Modal에서 사용자가 선택한 값의 타입은 Reference 로 고정이다.
4. Addon Component Type
Select Modal에서 사용자가 선택한 값을 출력하는 Addon Component 타입은 Form이다. 폼의 타입을 update Form 또는 View 2가지로 선택 할 수 있다.
설정이 적용되어 사용자가 실제 사용하는 화면은 다음과 같다.
검색 아이콘을 클릭하면 다음과 같이 연결해 놓은 Modal Page가 출력된다. 데이터를 선택하고 [OK] 버튼을 클릭하자.
선택한 데이터 값이 Reference Type의 Form 애드온 컴포넌트로 하단에 출력되는 것을 확인 할 수 있다. 이때 삭제(
) 아이콘 버튼이 검색 버튼 우측에 생성되며, 이를 클릭하면 선택한 데이터 정보가 사라진다.
Multiple
데이터를 다중 선택 할 수 있도록 Multiple 옵션을 제공한다.
