AEM - 触摸UI对话框隐藏和显示下拉选择标签

Question

我想创建一个基于标签的触摸UI对话框AEM（AEM-6.2）但我面临的问题隐藏标签。

我在对话框中有3个选项卡。

1. 一般（始终启用）
2. 运动（启用只有当选择运动）
3. 电影（启用仅在选择电影）

配置之前， '体育' 和'电影'选项卡被隐藏。在“常规”选项卡中，我有一个选择框“选择运动”和“选择电影”。在选择相应的选项卡应显示。我尝试使用下面给出的路径中提供的步骤，但无法隐藏选项卡。

路径： /libs/cq/gui/components/authoring/dialog/dropdownshowhide/clientlibs/dropdownshowhide/js/dropdownshowhide.js

其他参考我们尝试：https://github.com/aman02deep/aem-6.2/blob/master/tabshideshow.js

内容.xml文件：

       </items> 
          </selection> 
         </items> 
        </columns> 
       </items> 

     </generalPanel> 
     <sports 
      jcr:primaryType="nt:unstructured" 
      jcr:title="Sports" 
      sling:resourceType="granite/ui/components/foundation/container"> 
      <layout 
       jcr:primaryType="nt:unstructured" 
       sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns" 
       margin="{Boolean}false"/> 
       <items jcr:primaryType="nt:unstructured"> 
        <columns 
        jcr:primaryType="nt:unstructured" 
        sling:resourceType="granite/ui/components/foundation/container"> 
         <items jcr:primaryType="nt:unstructured"> 
          <sptext jcr:primaryType="nt:unstructured" 
            sling:resourceType="granite/ui/components/foundation/form/textarea" 
            fieldLabel="enter the text :" 
            name="./sp_text" 
            required="false"/> 

         </items> 
        </columns> 

       </items> 

     </sports> 
     <movies 
      jcr:primaryType="nt:unstructured" 
      jcr:title="Movies" 
      sling:resourceType="granite/ui/components/foundation/container"> 
      <layout 
       jcr:primaryType="nt:unstructured" 
       sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns" 
       margin="{Boolean}false"/> 
       <items jcr:primaryType="nt:unstructured"> 
        <columns 
        jcr:primaryType="nt:unstructured" 
        sling:resourceType="granite/ui/components/foundation/container"> 
         <items jcr:primaryType="nt:unstructured"> 
          <mvtext jcr:primaryType="nt:unstructured" 
            sling:resourceType="granite/ui/components/foundation/form/textarea" 
            fieldLabel="enter the text :" 
            name="./mv_text" 
            required="false"/> 

         </items> 
        </columns> 

       </items> 
     </movies> 
    </items> 
</content> 

Answer 1

你可以用花岗岩：数据创建一个数据属性，你可以隐藏和显示你convinicence使用jQuery。

1. 添加监听你的单选按钮
2. 添加花岗岩的改变：数据这两个选项卡
3. 监听被调用，隐藏和显示，根据您的选择和jQuery。

编号：https://docs.adobe.com/docs/en/aem/6-1/ref/granite-ui/api/jcr_root/libs/granite/ui/components/foundation/commonattrs.html