AEM 기본 이론 정리 (Component Dialog)

AEM Dialog

AEM Dialog
용어	설명
Dialog	사용자 인터페이스를 위한 노드로서, 사용자가 컴포넌트와 상호작용 할 수 있도록 입력 양식이나 버튼 등을 제공합니다
cq:dialog	각 컴포넌트에 대한 Dialog를 정의합니다
title	Dialog의 제목입니다
xtype	Dialog 내에서 사용할 컴포넌트의 xtype 입니다
items	Dialog 내에 포함될 입력 양식, 버튼 등의 컴포넌트입니다
fieldLabel	입력 양식의 라벨입니다
name	입력 양식의 이름입니다
allowBlank	입력 양식이 비어있어도 되는지 여부를 나타냅니다
defaultValue	입력 양식의 기본값입니다
options	선택 가능한 옵션들입니다
listeners	입력 양식에서 발생하는 이벤트를 처리하는 핸들러 함수들입니다

---

Dialog 영역 항목

• Dialog 영역 항목은 AEM의 컴포넌트에서 사용자가 편집할 수 있는 속성 값을 설정할 수 있는 UI 요소를 제공합니다.
• Dialog 영역은 컴포넌트의 작동에 필요한 데이터를 입력 받을 수 있는 장소이며, 컴포넌트의 편집 모드에서 호출됩니다.
• Dialog 영역은 컴포넌트의 작동을 위한 필수적인 정보를 담고 있으므로, 반드시 정확하게 구성해야 합니다.

Dialog 영역 항목
항목	설명
Dialog 위치	/apps/[프로젝트명]/component/[컴포넌트명]/dialog
파일 유형	cq:Dialog
구성 요소	-title: Dialog의 제목 -layout: Dialog 내에서 UI 요소를 배치하는 방식을 정의하는 컨테이너 요소 -xtype: UI  요소의 타입을 정의하는 속성 요소
추가 정보	-Dialog 내에 추가적인 커스텀 필드를 추가할 수 있음 -Dialog 내의 데이터를 저장하는 방식은 XML, JSON, Javascript 등 다양한 형식을 사용할 수 있음

---

Dialog 입력 항목

• 웹페이지 편집을 위해 사용되는 UI 구성 요소 중 하나로, 사용자가 페이지 콘텐츠를 수정할 수 있는 필드와 항목들을 제공

Dialog 입력 항목
입력 항목	설명
Textfield	텍스트를 입력하는 필드
Pathfield	경로를 선택하는 필드
Textarea	여러 줄의 텍스트를 입력하는 필드
Checkbox	체크박스
Radio Group	라디오 버튼 그룹
Select	드롭다운 메뉴
Multifield	동일한 유형의 여러 값을 입력하는 필드
Colorpicker	색상 선택 필드
Datepicker	날짜 선택 필드
Timepicker	시간 선택 필드
Numberfield	숫자를 입력하는 필드
Taginput	태그를 입력하는 필드
Pathbrowser	경로를 찾아 선택 하는 필드