Expand my Community achievements bar.

SOLVED

component dialog: how to auto-show/hide/retrieve fields (based on dropdown list selection. example inside)

Avatar

Level 9

Scenario.

  • I can have 1 or more primary tasks.
  • and 1 primary task can have 1 or more secondary tasks.
  • Both primary and secondary tasks are multifield (granite/ui/components/coral/foundation/form/multifield).

Screenshot explanation:

  • The primary task dropdown list has been entered via the "Primary Task" tab. I entered 4  values into it. (screenshot1)
  • On the secondary tab, I need to select 1 of the options from the "Primary tasks" that I entered.
  • If there are no "secondary tasks" associated with the selected "primary task", something like in screenshot2 is displayed. I will then manually enter records for it I choose to do so.
  • If there are "secondary tasks" associated with the selected "primary task", something like in screenshot3 will be displayed. The records will be displayed below and I should still be able to add more records.

Thanks heaps for the assistance.

3c544d54-6f5a-4658-8c67-947b1037be5d.pngca741ace-183f-4da8-9609-3bde6c8f03ca.png68f0e999-1a1f-4b2b-b9bc-cc4ff2940db3.png

1 Accepted Solution

Avatar

Correct answer by
Employee
4 Replies

Avatar

Employee

You can use custom render condition based on you selection you can show hide the fields in dialog or even tabs of the dialog.

Refer below tutorials - 

 https://levelup.gitconnected.com/aem-creating-custom-granite-render-conditions-28a21958f420.

https://jpsoares.medium.com/aem-granite-render-conditions-438c804b1e5a

 

Avatar

Level 9

any ideas on how to trigger a refresh when I change my selection in "primary task" dropdown?

Avatar

Correct answer by
Employee

you can refer below link for handling Select (Dropdown) change event.

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-handle-the-coral-ui...

Avatar

Community Advisor

Hi @jayv25585659 

 

You can achieve this using built in properties of AEM component dialog. Please refer below blog,

 

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager-blogs/show-hide-cq-dialog-...

 

Hope it helps