Expand my Community achievements bar.

Guidelines for the Responsible Use of Generative AI in the Experience Cloud Community.

Dynamic Drop Down lists

Avatar

Former Community Member

How do I link two drop down fields?  For example, a user chooses, country and then the city list is updated based on that choice.

6 Replies

Avatar

Former Community Member

This is done through script and is very dependant on your data source. There is an example where the data is hardcoded in one of the samples that ships with th eproduct. You pick a coountry and the state/province dropdown adjusts accordingly. This is in the dynamic interactive Purchase order sample. Look for this folder in your Designer install directory:

\8.2\EN\Samples\Forms\Purchase Order\Dynamic Interactive\Forms

Paul

Avatar

Level 10

Hi Paul,

I am trying to get into web service calls (ultimately to talk to databases). I am starting off with a free web service in order to get to grips with the steps.

I have got the WSDL data connections working OK, but the getCity returns a single node with the cities listed within the xml (in a textField):

<NewDataSet>
  <Table>
    <Country>Ireland</Country>
    <City>Cork Airport</City>
  </Table>
  <Table>
    <Country>Ireland</Country>
    <City>Dublin Airport</City>
  </Table>
  <Table>
    <Country>Ireland</Country>
    <City>Casement Aerodrome</City>
  </Table>
  <Table>
    <Country>Ireland</Country>
    <City>Shannon Airport</City>
  </Table>
</NewDataSet>

I am now trying to get a dropdown list populated with the <City> values. But without success. I have tried the dynamic list items in the dropdown field tab, but can't script for the specific value I want.

This dropdown is also associated with a different web service call; which will also return a single node that I will want to parse into different fields in the form:

<?xml version="1.0" encoding="utf-16"?>
<CurrentWeather>
  <Location>Cork Airport, Ireland (EICK) 51-51N 008-29W 162M</Location>
  <Time>Aug 19, 2009 - 02:30 PM EDT / 2009.08.19 1830 UTC</Time>
  <Wind> from the S (180 degrees) at 6 MPH (5 KT):0</Wind>
  <Visibility> 2 mile(s):0</Visibility>
  <SkyConditions> mostly cloudy</SkyConditions>
  <Temperature> 59 F (15 C)</Temperature>
  <DewPoint> 59 F (15 C)</DewPoint>
  <RelativeHumidity> 100%</RelativeHumidity>
  <Pressure> 29.71 in. Hg (1006 hPa)</Pressure>
  <Status>Success</Status>
</CurrentWeather>

Researching; I think I need to load the single node into the data DOM and parse. But can't figure this out!!  Help!!

Thanks,

Niall

Avatar

Former Community Member

You are right ..the web service returns XML and the binding expression has no idea what the structure is. I created soemthing similar for another project and I will paste the script below. You will jave to modify it but you will get the idea.

You will have to create a field on the form (make it hidden when you are finished) that will hold the result of the web service call. Don't forget to make it multi-line. Once the web service executes and the XML is in the field you need to load the XML into the Dom then manipulate the Dom to get the nodes that you want. In my case you enter a search criteria to find users and when you hit the button the web service executes and the results are returned in an XML structure. I then populate the dropdown so you can pick who to route the document to. Here is the code:

//Clear Dropdown lists

DropDownList2.clearItems();

DropDownList2.rawValue

= "";

//check to see if the user put a value in the search filter

if

(lookup_string.rawValue == null) {

     //Ooops no value

     app.alert('You must enter a search criteria...');

}

else {

     //Got a value now lets invoke the WS

     invokeBtn.execEvent('click');

     //Load the returned XML in the Dom at the same level data. The false, false are flags that say to overwrite if the node exists and to keep child nodes

     //xml_result is the name of my temp field

     xfa.datasets.data.loadXML(xml_result.rawValue

, false, false);

     //This is a debug step. I will write the Dom to the field so I can see the structure

     xml_result.rawValue

= xfa.datasets.data.saveXML("pretty");

     //Find the nodes that I want and assign them to theDataGroup - subset of the entire Dom

     var theDataGroup = xfa.resolveNode("xfa.data.people");

     //get the length of the subset Group

     var len = theDataGroup.nodes.length;

     //cycle through each node and add the name of the person to the dropdown. Each User node has a Name node and then other info. The Name

     //node is always 1st so I know that it is occuraance 0

     for (var i=0; i < len; i++){

          DropDownList2.addItem(theDataGroup.nodes.item(i).nodes.item(0).value);

     }

}

//Clear the temp field

xml_result.rawValue

= "";

//Remove the added nodes

var

oRemoveNode = xfa.resolveNode("xfa.data.people");

The structure of the XML is like this:

<people>

     <person>

          <Name>

          <Email>

          <Address>

     </person>

     <person>

     .....

</people>

You must be familiar with the XML as well as pretty good with code if you want to undertake this.

Hope that helps

Paul

Avatar

Level 10

Thanks Paul,

Yes, I have got it working where it pulls in the cities and populates the dropdown, but only the first time the form is previewed.

I am trying to work out the remove node script, following on from the variable at the end of your script:

     xfa.datasets.remove(oRemoveNode);

or

     xfa.datasets.data.remove(oRemoveNode);

or

     xfa.datasets.data.nodes.remove(oRemoveNode);

or

     other numerous variations....

I have looked through the LC Javascript guide and it has examples of xfa.record.nodes.remove(oRemoveNode); but I don't think that is right in this case.

I would be grateful if you could post the removal line - thanks,

Niall

Avatar

Former Community Member

I think it should be:

xfa.datasets.data.nodes.remove(oRemoveNode);

I have other examples where instead of passing the XML in as an object (oRemoveNode) you can identify directly.like this

xfa.datasets.data.nodes.remove(xfa.resolveNode("xfa.datasets.data.people"))

Let me know what you come up with

Paul

Avatar

Level 10

Thanks Paul,

I tried xfa.datasets.data.nodes.remove(xfa.resolveNode("xfa.datasets.data.NewDataSet")); but no joy!

I also tried to implement an "add node" from Stefan's blog but was unsuccessful.

Really this is an exercise to see how data comes in from a web service call as opposed to an ODBC data connection.

Given that we have the database connections working, I am not going to interfere with them until I have a better handle on WS.

Thanks again,

Niall