Modification of core functionality of multifield in dialog. | Adobe Higher Education
Skip to main content
M
maturubhanu
Level 2
February 17, 2025
Beantwortet

Modification of core functionality of multifield in dialog.

  • February 17, 2025
  • 3 Antworten
  • 565 Ansichten

Hi,

I have a requirement involving a core multifield dialog. Currently, the 'Add' button is located at the end of the last field. However, I need the 'Add' button to appear under each field. For example, if there are 6 text fields, the 'Add' button should be present under each of the 6 fields. Is it possible to achieve this? If so, could you please guide me on how to do it?.

Multifield means the granite one.

 

Thanks,

Bhanu M.

Dieses Thema wurde für Antworten geschlossen.
Beste Antwort von PRATHYUSHA_VP

Hi @maturubhanu 

 

I would suggest to write a custom script of your own to render the multifield add button similar to OOTB functionality. 

 

Thanks

3 Antworten

ManviSharma
Adobe Employee
ManviSharmaAdobe Employee
Adobe Employee
February 17, 2025

Hi Team,


To customize the multifield, you will need to create an overlay of the existing component. You can do this by copying the multifield component from /libs to /apps so that you can safely make changes without affecting the core implementation.

The Granite UI multifield is part of the Coral UI framework, which provides a set of reusable components for building AEM dialogs. The multifield component is typically defined in the repository under the path /libs/granite/ui/components/coral/foundation/form/multifield.


Then you would need to create an Overlay:

  • To customize the multifield, you will need to create an overlay of the existing component. You can do this by copying the multifield component from /libs to /apps so that you can safely make changes without affecting the core implementation.

  1. Override the render.jsp:

    • Inside your overlay, locate the render.jsp file. This file controls how the multifield is rendered in the dialog. You will need to modify this file to change the placement of the 'Add' button.

      After that, you can accordingly modify the rendering logic.






    PRATHYUSHA_VP
    Community Advisor
    PRATHYUSHA_VPCommunity AdvisorAntwort
    Community Advisor
    February 17, 2025

    Hi @maturubhanu 

     

    I would suggest to write a custom script of your own to render the multifield add button similar to OOTB functionality. 

     

    Thanks

      Mahedi_Sabuj
      Community Advisor
      Mahedi_SabujCommunity Advisor
      Community Advisor
      February 17, 2025

      You can achieve the same functionality using nested multifield.

      https://aemhints.com/2020/10/24/coral-nested-multifield-aem65/

      https://medium.com/p/92ff8d036ba1

      Mahedi Sabuj
        Allgemeine NutzungsbedingungenAccessibility statement

        Loading footer...