Highlighted

Sample code for Adaptive form Drop-down initialize from JSON

Mayank_Gandhi

Employee

11-07-2019

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");

}