Dynamic Options values in AEM dialog dropdown Using $PATH

In this post, I will explain a real project use-case, where I need to populate a Dropdown in my component dialog with dynamic values, but the condition are-

1. These values can only be fetched from the current resource or current page object.
2. Another condition is that this dropdown must be auto-populated when the dialog opened.

For example,  The drop down values can be the list of all parent pages of the page where this component was dropped.

Q1). How will you go for it?

You will think about ajax call because the dropdown can be filled with dynamic values using options property.

Q2). Yes, you are right then, what will you call from the options property?

Sling Servlet

If your answer is Sling Servlet then, I have some questions for you-

Q1). How will you get the current resource  or current page object in that servlet?
Q2). If you  are trying to pass the path of current resource then How will you do that?

OK, I think you are well understood what am I trying to say. How to get current resource or current page object into the called Sling Servlet.

Maybe you can do it using some other approach but in this post I will explain, How I complete this task?

In place of servlet I have created a JSP file under same component node with some selector (For ex. options.json). For Ex. My component structure is-

Now, I have set some properties on my drop-down dialog node. These properties are shown in figure-

3

Here you will notice that, I have used $PATH, this will return the path of the component wherever it is dropped. Then I used Sling Script Resolution Principle to call my options.json.jsp file.

For writing this blog, I had created dummy data but in actual, I had created a Sling Service and from one of it’s methods, I was getting the JSON values.

Here, you should follow standard coding practices and should remove these scriptlets from JSP file to some java file. But the key point is that this JSP must return the values in JSON format. If you are using Sightly then same code will work or if you want to use HTML in place of JSP then it will work perfectly fine.

I am also sharing the Git repository link where you can find demo examples for these properties.
Git repository link is –

https://bitbucket.org/accunitysoft/accunity-blog-snippets

Happy Coding..!!

Ankur Chauhan
Tech Lead

 

3 replies
  1. Radha Gangwar
    Radha Gangwar says:

    Hi,
    I’m trying to fetch the child nodes(Sling:Folder) of a parent node in my Component Dialog dropdown dynamically. I’m trying to do it via datasource but I’m not able to find the Current Page URL in dialog using datasource. Is there a way to achieve it or I have to write Servlet to achieve this?

    Reply
    • Nishant Gupta
      Nishant Gupta says:

      That is not directly possible because you don’t have the path of page when you go getResource() in your wcm use pojo. The best way to do that is get request object and get path from that. It has url of the page as well.

      Drop me an email at [email protected] or call me at 8587841599 and I will explain

      Reply
  2. Oliver Kaunds
    Oliver Kaunds says:

    This is a great solution. However I am trying to implement this in Touch UI and seems that doing options=$PATH.options.json doesn’t work in Touch UI.
    Can you please help with providing how to implement this with Touch UI?

    Thanks.

    Reply

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *