dialog - 如何在 aem 6 触摸对话框中创建单选按钮

Question

我有一个触摸 UI 组件，正在 AEM 6 中为其创建一个对话框。我需要在触摸对话框中创建 2 个单选按钮，如果选择其中之一，则显示所选单选按钮的相应值应显示按钮。但是，我不明白如何创建单选按钮选项。我在使用 xtype=selection 和 type=radiogroup 的经典对话框中实现了相同的功能，但我不明白如何在触摸对话框 中创建它

Answer 1

以下是 CoralUI v1/v2 的单选组示例。 radiogroup 是可选的，radio 小部件本身仍然可以工作。仅当您想要为组添加标签时才需要该组。

<radioGroup jcr:primaryType="nt:unstructured"
    name="./type"
    text="Fruit"
    required="{Boolean}true"
    sling:resourceType="granite/ui/components/foundation/form/radiogroup"
    renderReadOnly="{Boolean}true">

    <items jcr:primaryType="nt:unstructured">
        <radioApple jcr:primaryType="nt:unstructured"
            name="./fruit"
            text="Apple"
            value="apple"
            cq-msm-lockable="fruit"
            sling:resourceType="granite/ui/components/foundation/form/radio"
            renderReadOnly="{Boolean}true"/>
        <radioPear jcr:primaryType="nt:unstructured"
            name="./fruit"
            text="Pear"
            value="pear"
            cq-msm-lockable="fruit"
            sling:resourceType="granite/ui/components/foundation/form/radio"
            renderReadOnly="{Boolean}true"/>
        <radioDefaultValue jcr:primaryType="nt:unstructured"
            name="./fruit@DefaultValue"
            value="apple"
            sling:resourceType="granite/ui/components/foundation/form/hidden"/>
        <radioDefaultWhenMissing jcr:primaryType="nt:unstructured"
            name="./fruit@UseDefaultWhenMissing"
            value="true"
            sling:resourceType="granite/ui/components/foundation/form/hidden"/>
    </items>
</radioGroup>

注意:如果您需要在打开对话框之前设置默认值，那么您需要在模板中定义它(如果它是页面对话框)或为组件。

对于组件，要将默认值设置为 apple，您可以将其添加到 .content.xml 中:

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
          xmlns:jcr="http://www.jcp.org/jcr/1.0"
          jcr:primaryType="cq:Component"
          jcr:title="Fruit Component"
          componentGroup="My App Group"
          sling:resourceSuperType="foundation/components/parbase">

    <cq:template jcr:primaryType="nt:unstructured" fruit="apple"/>
</jcr:root>

另请参阅:

• http://docs.adobe.com/docs/en/aem/6-0/develop/ref/granite-ui/api/jcr_root/libs/granite/ui/components/foundation/form/radiogroup/index.html
• http://docs.adobe.com/docs/en/aem/6-0/develop/ref/granite-ui/api/jcr_root/libs/granite/ui/components/foundation/form/radio/index.html

注意:

If you are developing for AEM 6.3 then you will want the CoralUI3 flavour of all the components, i.e. instead of granite/ui/components/foundation/form/radio you should use granite/ui/components/coral/foundation/form/radio, etc.

For details on migrating to CoralUI 3 see https://helpx.adobe.com/experience-manager/6-3/sites/developing/using/reference-materials/granite-ui/api/jcr_root/libs/granite/ui/components/legacy/coral2/migration.html.