Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Adobe Summit 2023 [19th to 23rd March, Las Vegas and Virtual] | Complete AEM Session & Lab list

Sample code for Adaptive form Drop-down initialize from JSON

Avatar

Employee Advisor

Hi Guys,

I have seen a lot of customers requesting for code on how to populate the dropdown from JSON or call a REST service that returns JSON to set an Adaptive form dropdown. Here are two quick samples for the same.

You need to replace dropdownlist1562834391516 with you dropdown element and place the code in code-editor of any form field with initialize event.

Sample 1: You have the JSON already.

var text = '{"cars":[ "Ford", "BMW", "Fiat" ]}';

var jsonParsed = JSON.parse(text);

console.log(jsonParsed);

var DDL = [];

for (i = 0; i < jsonParsed.cars.length; i++) {

var idItem = jsonParsed.cars[i];

console.log(" item idteam" + idItem);

var nomeAzienda = jsonParsed.cars[i];

console.log("nomeAzienda" + nomeAzienda);

DDL.push(idItem + " = " + nomeAzienda);

}

dropdownlist1562834391516.items = DDL;

console.log("end of init function");

Sample 2: Making an AJAX call to get data and set a drop-down with the JSON response. Due to CORS policy, you can test this on IE only.

var xmlhttp = new XMLHttpRequest();

var url = "https://www.w3schools.com/js/myTutorials.txt";

xmlhttp.onreadystatechange = function() {

  if (this.readyState == 4 && this.status == 200) {

      var jsonParsed = JSON.parse(this.responseText);

      myFunction(jsonParsed);

  }

};

xmlhttp.open("GET", url, true);

xmlhttp.send();

function myFunction(jsonParsed) {

console.log(jsonParsed);

var DDL = [];

for (i = 0; i < jsonParsed.length; i++) {

    var idItem = jsonParsed[i].display;

  console.log(" item idteam"+idItem);

    var nomeAzienda = jsonParsed[i].display;

console.log("nomeAzienda"+nomeAzienda);

DDL.push(idItem + " = " + nomeAzienda);

}

dropdownlist1562834391516.items = DDL;

console.log(dropdownlist1562834391516.items);

  console.log("end of init function");

}

0 Replies

The ultimate experience is back.

Join us in Vegas to build skills, learn from the world's top brands, and be inspired.

Register Now