How can I have two different drop down menus depend on the same parent menu?

Question

I have two drop down menus that I want populated with identical data depending on what is selected on the parent drop down menu. Right now, I am using a javascript library that populates one child drop down menu based on a parent, but I need to have two drop down menus populated simultaneously.

This javascript library contains a function called PrintOptions that is supposed to populate the dropdown menu when something is selected from the parent menu. I have tried calling the same function twice one for each drop down menu, but it doesn't seem to be working.

This is where I got the library: http://www.javascripttoolbox.com/lib/dynamicoptionlist/documentation.php

Answer 1

In the event handler you have for your parent drop down, you are probably having some other code populate that child drop down. Simply add the code again, but instead reference the second drop down. That's the rough approach. There are some details and style guidance I'm leaving out, but that'll get the job done.

Answer 2

Reading the document you list, it seems there's a section that allows you to specify multiple child components from the parent:

To create the DynamicOptionList object, pass the names of the fields that are dependent on each other, with the parent field first.
Create the object by passing field names

var dol = new DynamicOptionList("Field1","Child1","Child2");

Or create an empty object and then pass the field names

var dol = new DynamicOptionList();
dol.addDependentFields("Field1","Child1","Child2");

Instead of trying to call the function more than once, just add the 2nd child component's name to the DynamicOptionList constructor, as in the first example above. As I read the docs that means whatever happens to Child1 will also happen to Child2 when Field1 is selected.

Answer 3

Did you ever get a response to this? I am trying to do this same. 1 parent drop down, and 2 child drop downs. With each child as the same.

I've tried as follows and still can't get it to work. I can get the 2 child drop downs to change between blank and stating "NULL" but can't get the rest.... THANKS!!

var TESTLIST = new DynamicOptionList("PARENT1","CHILD1","CHILD2"); TESTLIST.forValue("A").addOptionsTextValue("C","C","D","D"); TESTLIST.forValue("B").addOptionsTextValue("C","C","D","D");

A B

TESTLIST.printOptions("CHILD1")

TESTLIST.printOptions("CHILD2")