Conditional rendering fields in universal editor | Community
Skip to main content
CarlosPeJ
CarlosPeJ
Level 2
December 27, 2024

Conditional rendering fields in universal editor

  • December 27, 2024
  • 4 replies
  • 1615 views

Hi everyone,

We are working in a project with a React App and editing the content via Universal Editor. The content is being handled with content fragments.

We have a content fragment that has 3 fields: depending on what you select in the first field we want to display the second field or the third field.

Since each field in the universal editor looks like an iframe itself we cant figured out how to manage this case.

Is there any way to achieve this?

Thanks!

Carlos.

 

 

4 replies

daniel-strmecki
Community Advisor and Adobe Champion
daniel-strmeckiCommunity Advisor and Adobe Champion
Community Advisor and Adobe Champion
December 27, 2024

Hi @carlospej,

based on my experience so far with the Universal Editor, this is not possible. In my project, we used the approach of showing/hiding fields all the time in the old CF editor, but when we switched to the new CF editor we abandoned it and looked for alternative ways to solve it.

 

Good luck,

Daniel

    sarav_prakash
    Community Advisor
    sarav_prakashCommunity Advisor
    Community Advisor
    December 28, 2024

    Hi @carlospej , your question sounds, you want to author components/fields that are conditionally rendered. 

     

    I too have similar react app. On Load of page, default route is rendered. The iFrame canvases entire app, preventing authors to click on links/buttons to switch components. 

     

    But we use Preview button. Clicking Preview, removes the canvas and allows use to navigate/switch views. Once right component is loaded, we disable Preview mode and continue authoring. 

     

    Did you try this Preview button and does it help you? 

      CarlosPeJ
      CarlosPeJAuthor
      Level 2
      January 14, 2025

      Hi Sarav!

      Wat we want is to be able to render conditial fields depending o a selector.  For example, if we select in the Backgrond type "Color" we dont want to display the image "image" field

       

      We read something about custom fields but it seems that it only works for the CF old version.

       

      Thanks!

      Carlos

        sarav_prakash
        Community Advisor
        sarav_prakashCommunity Advisor
        Community Advisor
        January 14, 2025

        understood. this is on extension, not ootb ue. I haven't done such customization on extension. I ll try on my extensions, for similar usecase and reply if it works.

          arunpatidar
          Community Advisor
          arunpatidarCommunity Advisor
          Community Advisor
          December 30, 2024

          Hi @carlospej 

          You can check this if you want to show/hide field conditionally in the editor.

          https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/implementing/developing/universal-editor/customizing#conditionally-hide 

          Arun Patidar
            CarlosPeJ
            CarlosPeJAuthor
            Level 2
            January 14, 2025

            Hi Arun!

             

            Thanks for your reply, unfortunately the links seems to work only if you work with pure components right?

             

            We use content fragments to populate our content so in order to create our components-definition.json we have to point to the content fragments model instead of defining our component.

            arunpatidar
            Community Advisor
            arunpatidarCommunity Advisor
            Community Advisor
            January 14, 2025

            Hi @carlospej 

            Yeah it may possible that CF does not support this OOTB.

            Not sure if AEM Extensions helps here - https://developer.adobe.com/uix/docs/#explore-extensible-services 

            Arun Patidar
              kautuk_sahni
              Community Manager
              kautuk_sahniCommunity Manager
              Community Manager
              January 7, 2025

              @carlospej Did you find the suggestion helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!

              Kautuk Sahni
              CarlosPeJ
              CarlosPeJAuthor
              Level 2
              January 14, 2025

              Hi Kautuk!

              Thanks for the interest! but unfortunately it doesn't seem to work

               

              bests,

               

              Carlos

              Terms & ConditionsAccessibility statement

              Loading footer...