Dropdown in AEM Forms 6.3 using Data Integration(i.e.Form Data Model)

[onkarh71407069]

Hi,

I need to create dropdown using form data model.I have created Data Integration with mysql database.I want a column to be display in dropdown.How do I create it?

Thanks,

Onkar Hattekar.

[onkarh71407069]

Is it possible to do it without servlet?

[Jared_Langdon]

I'd like to know too.  Any updates?

[smacdonald2008]

Here are new AEM Form tutorials:

• Create an adaptive form and form data model
• Use adaptive form rule editor to build business rules
• Style an adaptive form
• Test and publish an adaptive form

[Jared_Langdon]

None of the tutorials cover this use case.  I was able to get it going, so I'll describe my solution here.  I hope it helps someone.

First, using the data model editor, create a form data model “get” service.  In this example, I fetch the entire contents of a table and return it as an array.  The table contains industry codes.  Note that I have no arguments, since I want all the values.  Be sure to give your service a title that describes what it does.

Here’s a look at the output when I test the service:

Create a drop-down list in your form.  Add a rule using the visual editor.  Select when dropdown is initialized.  Select the action “invoke service”.  You should see the title of your service in the list provided.  Select it.  You will be prompted to select the inputs and outputs, but don’t bother doing so.  The rest will be done in the code editor.  Visual editor may complain a bit at this point because you've left some bits unspecified, but don't worry about that.  We'll handle the rest in code.

Switch to the code editor.  Here’s what I see at this point:

The visual editor was necessary because it got us the internal operationName.  In my case, it’s get_15319465910350.  I don’t know how else to get this internal name, which we need for the script to work.  If there's another way to get this value, please let me know in this thread.

The auto-generated code passes three parameters to the (undocumented?) guidelib.dataIntegrationUtils object.  By inspecting this object, I discovered that there is a fourth parmeter called processOutputCallback.  That’s how we’re going to get our data.

Modify your code along the lines of the following example.  Of course, your data source will have different field names.  I know that executeOperation passes another couple of Ajaxish parameters to the callback function.  If you know where the documentation can be found, please leave a link here.  Also, if you have suggestions for how to properly handle the result (error handling, etc.), please advise.

Notice that I am referring to the dropdown list by name (in my case “myNaicsDropdown”) rather than using the “this” keyword.  Using “this” doesn’t work for me.  Maybe it's something about it being a callback function that causes the "this" reference to be lost.

[fabioper85]

Hi Jared

I tried to implement your solution and It works till the end of the callback, but my dropdown.items is still empty

Paste the code down here, can you tell me if you see something wrong?

Thank you so much for your help

function initDropdown(jsonResult) {

  var jsonParsed = JSON.parse(jsonResult);

  console.log(jsonParsed);

  var DDL = [];

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

    var item = jsonParsed[i];

    var idItem = item.id;

    var nomeAzienda = item.text;

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

  }

  dropdownlist1532693832922.items = DDL;

// I can see these two lines of code in the console

  console.log(dropdownlist1532693832922.items);

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

}

var operationInfo = {

    "formDataModelId": "/content/dam/formsanddocuments-fdm/perretta_selda",

    "operationTitle": "getUsersAdobeForum",

    "operationName": "get_15329573824570"

};

var inputs = {};

var outputs = {};

guidelib.dataIntegrationUtils.executeOperation(operationInfo, inputs, outputs, initDropdown);

// if I console.log here my dropdownlist1532693832922.items returns "undefined"

[Jared_Langdon]

Please post the first few lines of output from:

console.log(jsonParsed);

If there's nothing there, then post console.log(jsonResult)

[fabioper85]

Solved on his own! Now works perfectly!!

Thank you so much, Jared!

Fabio

[Rucha_Supe]

Thank you so much Jared for this post it helped me alot.