Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of Contents
minLevel1
maxLevel7

SelectModal UI

...

Select Modal 컴포넌트는 Select 컴포넌트의 한 종류로, 선택 옵션을 Modal로 출력하여 사용자로 하여금 데이터의 상세 정보를 확인 한 뒤 선택 할 수 있도록 하는 것이다.

...

2. Multiple Type

Selec Modal에

...

Basic UI

Select Modal의 기본 UI는 다음과 같다.

...

...

Function

1. Modal Render Type

Modal Render TypePage 또는 Components로 선택 할 수 있다. 예를 들어 Page를 선택했다면, 다음과 같이 모달로 연결하여 출력 할 페이지를 Modal Page 셀렉트 옵션에서 선택할 수 있다.

...

Select Modal에서 사용자가 선택한 값을 출력하는 Addon Component 타입은 Form이다. 폼의 타입을 update Form 또는 View 2가지로 선택 할 수 있다.

...

(lightbulb) 설정이 적용되어 사용자가 실제 사용하는 화면은 다음과 같다.

...

검색 아이콘을 클릭하면 다음과 같이 연결해 놓은 Modal Page가 출력된다. 데이터를 선택하고 [OK] 버튼을 클릭하자.

...

선택한 데이터 값이 Reference TypeForm 애드온 컴포넌트로 하단에 출력되는 것을 확인 할 수 있다. 이때 삭제((error)) 아이콘 버튼이 검색 버튼 우측에 생성되며, 이를 클릭하면 선택한 데이터 정보가 사라진다.

...

...

5. Multiple

...

데이터를 다중 선택 할 수 있도록 Multiple 옵션을 제공한다.

...

Image RemovedImage Added

Multiple Value Type

Select Modal에서 사용자가 선택한 값의 타입은 Reference, Children 2가지가 있다.

Addon Multiple Component Type

Select Modal에서 사용자가 값을 선택하면, Sortable, List, Grid 3가지 타입으로 출력 할 수 있다.

a. Sortable
  • Drag Sort

  • Show Header

b. List
  • Drag Sort

  • Show Image

  • Title Field Id

  • Description Field Id

c. Grid
  • Title Field Id

  • Description Field Id

Max Item Count

...

다중 선택 할 수 있는 Max 값을 설정 할 수 있다.

Limit message

...

6. Show Actions

7. Show Order