<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Re: AEMaaCS - Multifield with show/hide inside another multifield item is not working properly in Adobe Experience Manager Questions</title>
    <link>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462142#M133334</link>
    <description>&lt;P&gt;Hi&amp;nbsp;&lt;LI-USER uid="17382717"&gt;&lt;/LI-USER&gt;&amp;nbsp;, I understand you are trying to show hide inner multifield in a nested multifield case. Here the code given by Arun will not work as it is looking for your element in the first level.&lt;/P&gt;&lt;P&gt;Here is the approach you need to follow to update that JS.&lt;/P&gt;&lt;P&gt;Step1: Try creating Nested Multifield like below&lt;/P&gt;&lt;PRE&gt; &amp;lt;firstMF
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="granite/ui/components/foundation/container"&amp;gt;
                        &amp;lt;items jcr:primaryType="nt:unstructured"&amp;gt;
                            &amp;lt;files
                                granite:class="multifield-class"
                                granite:data="multifielddata"
                                jcr:primaryType="nt:unstructured"
                                sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                class="full-width"
                                composite="{Boolean}true"
                                fieldLabel="First Multi Field"
                                validation="multi-validate"&amp;gt;
                                &amp;lt;field
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/container"
                                    name="./firstMF"&amp;gt;
                                    &amp;lt;items jcr:primaryType="nt:unstructured"&amp;gt;
                                        &amp;lt;heading
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/foundation/form/textfield"
                                            fieldLabel="Heading"
                                            name="./heading"
                                            required="{Boolean}true"/&amp;gt;
                                        &amp;lt;secondMF
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                            composite="{Boolean}true"
                                            fieldLabel="Second Multi Field"&amp;gt;
                                            &amp;lt;field
                                                jcr:primaryType="nt:unstructured"
                                                sling:resourceType="granite/ui/components/coral/foundation/container"
                                                name="./secondMF"&amp;gt;
                                                &amp;lt;items jcr:primaryType="nt:unstructured"&amp;gt;
                                                    &amp;lt;label
                                                        jcr:primaryType="nt:unstructured"
                                                        sling:resourceType="granite/ui/components/foundation/form/textfield"
                                                        fieldLabel="Link - Label"
                                                        name="./label"
                                                        required="{Boolean}false"/&amp;gt;
                                                   &amp;lt;image&lt;BR /&gt;.&lt;BR /&gt;.Your Existing Image Field&lt;BR /&gt;.&lt;BR /&gt;.&amp;lt;granite:data&lt;BR /&gt;id:imagesecondMF&lt;BR /&gt;&amp;gt;&lt;BR /&gt;./&amp;gt;&lt;BR /&gt;&amp;lt;video&lt;BR /&gt;.&lt;BR /&gt;.Your Existing Video Field&lt;BR /&gt;.&amp;lt;granite:data&lt;BR /&gt;id:videosecondMF&lt;BR /&gt;&amp;gt;&lt;BR /&gt;.&lt;BR /&gt;./&amp;gt;
                                                &amp;lt;/items&amp;gt;
                                            &amp;lt;/field&amp;gt;
                                        &amp;lt;/secondMF&amp;gt;
                                    &amp;lt;/items&amp;gt;
                                &amp;lt;/field&amp;gt;
                            &amp;lt;/files&amp;gt;
                        &amp;lt;/items&amp;gt;
                    &amp;lt;/firstMF&amp;gt;&lt;/PRE&gt;&lt;P&gt;Step2:&amp;nbsp; Now, Implement Mutationobserver like this&amp;nbsp;&lt;/P&gt;&lt;PRE&gt;var ourObserver = new MutationObserver(function() {

});
ourObserver.observe(document.querySelector("#imagesecondMF"), 
{childList: true, subtree: true}
// // try showHide here
);
ourObserver.observe(document.querySelector("#vidoesecondMF"), 
{childList: true, subtree: true}
// try showHide here
// 
);&lt;/PRE&gt;&lt;P&gt;Step 3:&amp;nbsp;&amp;nbsp;&lt;BR /&gt;Increment each id of image selection &amp;amp; Video selection while adding them to avoid malfunction&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;I know,this is long approach, but it will help you for sure.&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;~Aditya.Ch&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;</description>
    <pubDate>Thu, 21 Jul 2022 16:10:12 GMT</pubDate>
    <dc:creator>Aditya_Chabuku</dc:creator>
    <dc:date>2022-07-21T16:10:12Z</dc:date>
    <item>
      <title>AEMaaCS - Multifield with show/hide inside another multifield item is not working properly</title>
      <link>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462121#M133329</link>
      <description>&lt;P&gt;Hi,&lt;/P&gt;&lt;P&gt;Below is the scenario,&lt;/P&gt;&lt;P&gt;* There is a multifiled item for steps , where each step has title,description and multiple images/videos.&lt;/P&gt;&lt;P&gt;* Within each step , since user can enter multiple images/videos that is also been made multifield item.&lt;/P&gt;&lt;P&gt;* This multifield images/videos is show/hide dropdown with image and video as selectors.&lt;/P&gt;&lt;P&gt;* When you select image or video, few fields are hidden/shown depending on what you select.&lt;/P&gt;&lt;P&gt;* This works fine within step1( remember step1 is a part of main multifield item within which we have multifield show/hide items for images/videos).&lt;/P&gt;&lt;P&gt;* But when you try to select video/image in step2 , it breaks.&lt;/P&gt;&lt;P&gt;* Issue is let's say dialog fields are like below:&lt;/P&gt;&lt;P&gt;step1:&lt;/P&gt;&lt;P&gt;&amp;nbsp;+ title&lt;/P&gt;&lt;P&gt;&amp;nbsp;+description&lt;/P&gt;&lt;P&gt;&amp;nbsp;+assets&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp;item1&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +image&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +imagepath&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +alt&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; item2&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +video&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +videopath&lt;/P&gt;&lt;P&gt;&amp;nbsp;step2:&lt;/P&gt;&lt;P&gt;&amp;nbsp;+ title&lt;/P&gt;&lt;P&gt;&amp;nbsp;+description&lt;/P&gt;&lt;P&gt;&amp;nbsp;+assets&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; item1&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +video&lt;/P&gt;&lt;P&gt;&amp;nbsp; &amp;nbsp; &amp;nbsp; &amp;nbsp; +videopath&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;from above example:&lt;/P&gt;&lt;P&gt;when I select video dropdown for item1 in step2 , item1 of the step1 will show videopath instead of imagepath.&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;I have already incorportated whatever&amp;nbsp;&lt;LI-USER uid="6786635"&gt;&lt;/LI-USER&gt;&amp;nbsp; has suggested in this question :&amp;nbsp;&lt;A href="https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aem6-4-multifield-with-show-hide-dropdown-changing-all-the-items/m-p/237275" target="_blank"&gt;https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aem6-4-multifield-with-show-hide-dropdown-changing-all-the-items/m-p/237275&lt;/A&gt;&amp;nbsp; , because this changes it is working fine within step1 I mean show/hide works fine within each steps but not between steps.&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;</description>
      <pubDate>Thu, 21 Jul 2022 13:44:50 GMT</pubDate>
      <guid>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462121#M133329</guid>
      <dc:creator>ganeshbyale</dc:creator>
      <dc:date>2022-07-21T13:44:50Z</dc:date>
    </item>
    <item>
      <title>Re: AEMaaCS - Multifield with show/hide inside another multifield item is not working properly</title>
      <link>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462142#M133334</link>
      <description>&lt;P&gt;Hi&amp;nbsp;&lt;LI-USER uid="17382717"&gt;&lt;/LI-USER&gt;&amp;nbsp;, I understand you are trying to show hide inner multifield in a nested multifield case. Here the code given by Arun will not work as it is looking for your element in the first level.&lt;/P&gt;&lt;P&gt;Here is the approach you need to follow to update that JS.&lt;/P&gt;&lt;P&gt;Step1: Try creating Nested Multifield like below&lt;/P&gt;&lt;PRE&gt; &amp;lt;firstMF
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="granite/ui/components/foundation/container"&amp;gt;
                        &amp;lt;items jcr:primaryType="nt:unstructured"&amp;gt;
                            &amp;lt;files
                                granite:class="multifield-class"
                                granite:data="multifielddata"
                                jcr:primaryType="nt:unstructured"
                                sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                class="full-width"
                                composite="{Boolean}true"
                                fieldLabel="First Multi Field"
                                validation="multi-validate"&amp;gt;
                                &amp;lt;field
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/container"
                                    name="./firstMF"&amp;gt;
                                    &amp;lt;items jcr:primaryType="nt:unstructured"&amp;gt;
                                        &amp;lt;heading
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/foundation/form/textfield"
                                            fieldLabel="Heading"
                                            name="./heading"
                                            required="{Boolean}true"/&amp;gt;
                                        &amp;lt;secondMF
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                            composite="{Boolean}true"
                                            fieldLabel="Second Multi Field"&amp;gt;
                                            &amp;lt;field
                                                jcr:primaryType="nt:unstructured"
                                                sling:resourceType="granite/ui/components/coral/foundation/container"
                                                name="./secondMF"&amp;gt;
                                                &amp;lt;items jcr:primaryType="nt:unstructured"&amp;gt;
                                                    &amp;lt;label
                                                        jcr:primaryType="nt:unstructured"
                                                        sling:resourceType="granite/ui/components/foundation/form/textfield"
                                                        fieldLabel="Link - Label"
                                                        name="./label"
                                                        required="{Boolean}false"/&amp;gt;
                                                   &amp;lt;image&lt;BR /&gt;.&lt;BR /&gt;.Your Existing Image Field&lt;BR /&gt;.&lt;BR /&gt;.&amp;lt;granite:data&lt;BR /&gt;id:imagesecondMF&lt;BR /&gt;&amp;gt;&lt;BR /&gt;./&amp;gt;&lt;BR /&gt;&amp;lt;video&lt;BR /&gt;.&lt;BR /&gt;.Your Existing Video Field&lt;BR /&gt;.&amp;lt;granite:data&lt;BR /&gt;id:videosecondMF&lt;BR /&gt;&amp;gt;&lt;BR /&gt;.&lt;BR /&gt;./&amp;gt;
                                                &amp;lt;/items&amp;gt;
                                            &amp;lt;/field&amp;gt;
                                        &amp;lt;/secondMF&amp;gt;
                                    &amp;lt;/items&amp;gt;
                                &amp;lt;/field&amp;gt;
                            &amp;lt;/files&amp;gt;
                        &amp;lt;/items&amp;gt;
                    &amp;lt;/firstMF&amp;gt;&lt;/PRE&gt;&lt;P&gt;Step2:&amp;nbsp; Now, Implement Mutationobserver like this&amp;nbsp;&lt;/P&gt;&lt;PRE&gt;var ourObserver = new MutationObserver(function() {

});
ourObserver.observe(document.querySelector("#imagesecondMF"), 
{childList: true, subtree: true}
// // try showHide here
);
ourObserver.observe(document.querySelector("#vidoesecondMF"), 
{childList: true, subtree: true}
// try showHide here
// 
);&lt;/PRE&gt;&lt;P&gt;Step 3:&amp;nbsp;&amp;nbsp;&lt;BR /&gt;Increment each id of image selection &amp;amp; Video selection while adding them to avoid malfunction&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;I know,this is long approach, but it will help you for sure.&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;~Aditya.Ch&lt;/P&gt;&lt;P&gt;&amp;nbsp;&lt;/P&gt;</description>
      <pubDate>Thu, 21 Jul 2022 16:10:12 GMT</pubDate>
      <guid>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462142#M133334</guid>
      <dc:creator>Aditya_Chabuku</dc:creator>
      <dc:date>2022-07-21T16:10:12Z</dc:date>
    </item>
    <item>
      <title>Re: AEMaaCS - Multifield with show/hide inside another multifield item is not working properly</title>
      <link>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462146#M133337</link>
      <description>&lt;P&gt;Check this if helps&amp;nbsp;&lt;A href="https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/hide-and-show-dropdown-in-nested-multifield/m-p/461811#M133226" target="_blank"&gt;https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/hide-and-show-dropdown-in-nested-multifield/m-p/461811#M133226&lt;/A&gt;&amp;nbsp;&lt;/P&gt;</description>
      <pubDate>Thu, 21 Jul 2022 16:20:47 GMT</pubDate>
      <guid>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462146#M133337</guid>
      <dc:creator>arunpatidar</dc:creator>
      <dc:date>2022-07-21T16:20:47Z</dc:date>
    </item>
    <item>
      <title>Re: AEMaaCS - Multifield with show/hide inside another multifield item is not working properly</title>
      <link>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462861#M133617</link>
      <description>&lt;P&gt;I thought only I can mark questions as answered .&lt;/P&gt;</description>
      <pubDate>Wed, 27 Jul 2022 06:23:56 GMT</pubDate>
      <guid>https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/aemaacs-multifield-with-show-hide-inside-another-multifield-item/m-p/462861#M133617</guid>
      <dc:creator>ganeshbyale</dc:creator>
      <dc:date>2022-07-27T06:23:56Z</dc:date>
    </item>
  </channel>
</rss>

