Dynamically populate selection dropdown in a dialog with a datasource using JSON | Community
Skip to main content
keshava219
keshava219
Level 3
July 5, 2022
Solved

Dynamically populate selection dropdown in a dialog with a datasource using JSON

  • July 5, 2022
  • 4 replies
  • 2949 views

Hi ,

 

I want to create a "Dynamically populate selection dropdown in a dialog with a datasource using JSON" have any perfect reference please ping me how to do step wise function.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Mohit_KBansal

Check out ACS commons Generic List [1]

 

[1] https://adobe-consulting-services.github.io/acs-aem-commons/features/generic-lists/index.html

4 replies

Mohit_KBansal
Adobe Employee
Mohit_KBansalAdobe EmployeeAccepted solution
Adobe Employee
July 5, 2022

Check out ACS commons Generic List [1]

 

[1] https://adobe-consulting-services.github.io/acs-aem-commons/features/generic-lists/index.html

    AshwiniSathe1
    AshwiniSathe1
    Level 3
    July 5, 2022

    Hi @keshava219

    Checkout this video, try latest ACS commons package.

    https://www.youtube.com/watch?v=PqHOgKBs30U

    Hope this will help!

      arunpatidar
      Community Advisor
      arunpatidarCommunity Advisor
      Community Advisor
      July 5, 2022

      Please check https://aemlab.blogspot.com/2019/07/aem-touch-ui-dropdown-from-json.html 

      Arun Patidar
        ShaileshBassi
        Community Advisor
        ShaileshBassiCommunity Advisor
        Community Advisor
        July 5, 2022

        @keshava219  You can create datasource node structure with sling:resourceType of datasource as sling:resourceType (String) = /bin/dropdownList ( i.e. Path of the servlet implementing the data source for dynamic value). It will give the desire result of a dynamic dropdown as you can see below the screenshot.

         

            

         

        For DataSource Servlet (/bin/dropdownList) Implementation you can refer to below articles:

        https://redquark.org/aem/day-17-granite-datasources/ 

        http://www.sgaemsolutions.com/2019/01/dynamically-populate-drop-down-values.html 

        Hope this helps

        Thanks

          keshava219
          keshava219Author
          Level 3
          July 7, 2022

          hi @shaileshbassi,

           

                           Thanks, this was helpfull But  I want to pass along with parameters as well to servlet from dialog which author mention

          Example 

           

                       On dialog  i have numerical number i want to pass to servlet  this value  possible?

          AdobeID24
          AdobeID24
          Level 5
          October 10, 2022

          Hi @keshava219 

          you should write dialog js so that wehn you change on dialog level at that time only dropdown value get changed (at the same time )---> Js will help you on that...

           

          But if you want to pass the value in servlet , it can be done like below mentioned code snippet . but this would not be "on the fly" ..Suppose value is 5 .after dialog submission only your dropdown items count  would be 5   ..when you made it suppose 6 then submit dialog again and open it again then only 6 items you will be able to see ..In backedn it will work like that 

           

          as you registered servlet with path ...just read the  dailog values of your field "Number of Articles to Show " in your servlet 

          smething like this you can do 

           

          then you can use this value and put the logic to just those many dropdown selection items .

           


          String cmptOnPage = req.getPathInfo().toString();
          String actualPath = cmptOnPage.substring(cmptOnPage.lastIndexOf("/content"), cmptOnPage.length());
          ValueMap actualResourceValueMap = req.getResourceResolver().getResource(actualPath).adaptTo(ValueMap.class);
          String dialogVlaues =actualResourceValueMap.get("text", String.class);

          logger.info("dialogVlaues path "+dialogVlaues);


          /** ------------------------------------------------------------

           

          Terms & ConditionsAccessibility statement

          Loading footer...