국가 구성 요소에 대한 대화상자 생성
[AEM Forms as a Cloud Service]{class="badge informative"}
국가 구성 요소는 드롭다운 구성 요소의 대화 상자 구조를 상속하지만 대륙이라는 새 속성을 도입합니다. 또한 드롭다운 구성 요소에서 상속된 특정 필드를 숨기도록 대화 상자를 사용자 정의하는 동시에 작성자가 원하는 대륙을 선택할 수 있습니다.
이 대화 상자를 만드는 가장 쉬운 방법은 다음과 같습니다.
- AEM 프로젝트에서 국가 구성 요소 폴더 아래에 _cq_dialog라는 폴더를 만듭니다.
- _cq_dialog 폴더 내에서 .content.xml이라는 파일을 만듭니다.
- 아래에 제공된 XML 코드를 이 파일에 붙여넣습니다.
- 변경 사항을 저장하고 프로젝트를 AEM과 동기화합니다.
국가 구성 요소에 대한 대화 상자 구성이 추가됩니다.
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
jcr:primaryType="nt:unstructured"
jcr:title="Country of Residence"
sling:resourceType="cq/gui/components/authoring/dialog">
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<tabs
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/tabs"
maximized="true">
<items jcr:primaryType="nt:unstructured">
<basic
jcr:primaryType="nt:unstructured"
jcr:title="Basic"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<columns
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns"
margin="{Boolean}true">
<items jcr:primaryType="nt:unstructured">
<column
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<saveValueType
granite:class="cmp-adaptiveform-dropdown__savevaluetype"
jcr:primaryType="nt:unstructured"
sling:orderBefore="placeholder"
sling:resourceType="granite/ui/components/coral/foundation/form/select"
fieldLabel="Save value as"
name="./typeIndex"
typeHint="String">
<items jcr:primaryType="nt:unstructured">
<String
jcr:primaryType="nt:unstructured"
text="String"
value="0"/>
<Number
jcr:primaryType="nt:unstructured"
text="Number"
value="1"/>
<Boolean
jcr:primaryType="nt:unstructured"
text="Boolean"
value="2"/>
</items>
</saveValueType>
<type
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/hidden"
name="./type"/>
<enums
jcr:primaryType="nt:unstructured"
sling:hideResource="{Boolean}true"
sling:orderBefore="bindref"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<enumOptions
jcr:primaryType="nt:unstructured"
sling:orderBefore="bindref"
sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
fieldDescription="Provide the pair of enum (data value) and enumName (display text) for each option."
fieldLabel="Options">
<field
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container"
name="./enum">
<items jcr:primaryType="nt:unstructured">
<enum
granite:class="cmp-adaptiveform-base__enum"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldDescription="Specify the content to submit, when the option is selected."
fieldLabel="Data value"
name="./enum"
required="{Boolean}true"/>
<enumNames
granite:class="cmp-adaptiveform-base__enumNames"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldDescription="Specify the content to display in the adaptive form."
fieldLabel="Display text"
name="./enumNames"
required="{Boolean}false"/>
<richTextEnumNames
jcr:primaryType="nt:unstructured"
sling:hideResource="{Boolean}true"/>
</items>
</field>
</enumOptions>
<enumNames
granite:hidden="true"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/multifield">
<field
granite:class="cmp-adaptiveform-base__enumNamesHidden"
granite:hidden="true"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
name="./enumNames"/>
</enumNames>
<areOptionsRichText
jcr:primaryType="nt:unstructured"
sling:hideResource="true"/>
</items>
</enums>
<multiSelect
granite:class="cmp-adaptiveform-dropdown__allowmultiselect"
jcr:primaryType="nt:unstructured"
sling:orderBefore="saveValueType"
sling:resourceType="granite/ui/components/coral/foundation/form/checkbox"
name="./multiSelect"
text="Allow multiple selection"
value="true"/>
<multiSelect-typehint
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/hidden"
name="./multiSelect@TypeHint"
value="Boolean"/>
<defaultValueSS
jcr:primaryType="nt:unstructured"
sling:orderBefore="placeholder"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
fieldDescription="Specified default option is preselected on form load."
fieldLabel="Default option"
name="./default"
wrapperClass="cmp-adaptiveform-dropdown__defaultvalue"/>
<defaultValueMS
jcr:primaryType="nt:unstructured"
sling:orderBefore="placeholder"
sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
fieldDescription="Specified default options are preselected on form load."
fieldLabel="Default options"
typeHint="String[]"
wrapperClass="cmp-adaptiveform-dropdown__defaultvaluemultiselect">
<field
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
name="./default"
required="{Boolean}false"/>
</defaultValueMS>
<continent
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/select"
fieldLabel="Select Continent"
name="./continent"
required="true">
<items jcr:primaryType="nt:unstructured">
<northAmerica
jcr:primaryType="nt:unstructured"
text="North America"
value="northamerica"/>
<europe
jcr:primaryType="nt:unstructured"
text="Europe"
value="europe"/>
<asia
jcr:primaryType="nt:unstructured"
text="Asia"
value="asia"/>
<africa
jcr:primaryType="nt:unstructured"
text="Africa"
value="africa"/>
</items>
</continent>
</items>
</column>
</items>
</columns>
</items>
</basic>
</items>
</tabs>
</items>
</content>
</jcr:root>
4859a77c-7971-4ac9-8f5c-4260823c6f69