Skip to main content
S
Stevie38923324rffg
Known Participant
April 11, 2025
Answered

How to get 2 layers, triggered by 2 separate drop down menus, to appear at the same time?

  • April 11, 2025
  • 3 replies
  • 2582 views

Hi All,

I currently have a drop down menu that uses the below formula (under Run Custom Validation Script) to pull-up different layers with pictures. When the name matching the layer is selected in the drop down menu, the picture/layer appears. When I select a different name, the previous picture goes away and the new picture appears, and if there's no matching layer name in the drop down list, no picture/layer appears at all. Perfect.

 

However, when I tried to use the same formula in a second drop down list, so that I could see BOTH the picture/layer of the first drop down and also the picture/layer of the second drop down at the same time, only the picture/layer of the second drop down appears.

 

I'm looking for the same functionality I had before; if I choose an option in the drop down that has a matching layer name, the picture should appear, and stay until another picture is chosen or there's no matching layer name in the drop down list. I just want that for 2 separate drop down lists 🙂  Thanks in advance for your help!

 

var ocgs = this.getOCGs();
if (ocgs) {
for (var i in ocgs) {
ocgs[i].state = (ocgs[i].name==event.value);
}
}

Correct answer Thom Parker

@PDF Automation Station I think that might be correct because I couldn't get the pictures to come up at all under the original line.

 

Thanks @Thom Parker ,

I first added the below general formula to 2 sections, and only added 2 layers titled "Sec1.Pic1" and "Sec2.Pic1". But I'm guessing that having "Pic1" be the name of both was a problem because when I selected that value in section 1, it also automatically appeared in Section 2 (without any value being selected from the drop down menu in Section 2).

 

So then I renamed the layers to "Sec1.Apple" and "Sec2.Orange", but then I can still only have the layer pictured in one section at a time. I cannot get the apple and orange layers to be on at the same time yet.  Any other suggestions? Thx!

 

(This is in the "Model" drop down list, and the version in Section 2 does change the drop down names and also references "Sec2"):

 

var ocgs = this.getOCGs();
var otherDropDownValue = this.getField("Inner").value;
var aNameParts;
if (ocgs) {
for (var i in ocgs) {
aNameParts = ocgs[i].name.split(".");
ocgs[i].state = (aNameParts[0] == "Sec1") && (aNameParts[1] ==event.value) || (aNameParts[1] ==otherDropDownValue);
}
}


I throw out code pretty add hoc and untested.  So Yes, the script needs some refinement.  I did not properly include the filter.

 

Here it is 

var ocgs = this.getOCGs();
var otherDropDownValue = this.getField("Inner").value;
var aNameParts;
if (ocgs) {
    for (var i in ocgs) {
       aNameParts = ocgs[i].name.split(".");
       // here's the missing part
       if(aNameParts[0] == "Sec1")
          ocgs[i].state =  (aNameParts[1] ==event.value) || (aNameParts[1] ==otherDropDownValue);
    }
}

 

3 replies

S
Stevie38923324rffgAuthor
Known Participant
May 22, 2025

@Thom Parker and All,

I need to take this one step further and I have no idea where to start. The formula Thom provided under the "correct answer" is working perfectly for section 1 of my form. But I now need to create 2 more sections just like it (the additional 2 sections will be on page 2, in case that matters) and I want the pictures that I choose for each section to stay on as long as their corresponding drop down menu choices are selected.

 

Currently, when I duplicate/modify this script into the 2 additional sections, only the pictures of one section can appear at the same time. For example, if I have selected options from the 2 pull down menus in section 1, and have the corresponding pictures/layers showing, when I go to do the same in section 2, the pictures/layers for section 2 will appear, but the pictures in section 1 will disappear.  I want the pictures I choose in each section to remain visible, so long as the corresponding drop down menu choices in that section are selected. 

 

Any chance there's a formula we could create for that? 🙂 Thanks so much in advance!!

Thom Parker
Community Expert
Thom ParkerCommunity Expert
Community Expert
May 22, 2025

That makes sense, since currently all OCG layers are being examined by a script in every section. To use different layers in different sections, a method is needed for filtering the layers so that only the layers for a particular section are examined.  

An easy way to do this is with names, or OCGGroups.  Actual grouping can't be done in Acrobat, but seting up the names can. 

Use names like "Sec1.Pic1", etc. where the second part of the name (after the "." ) is the same as the dropdown value, and the first part is the section name. 

 

Then the scripts can be modified to only look at specific sets of OCGs by filtering on the section names. 

var ocgs = this.getOCGs();
var otherDropDownValue = this.getField("OtherDropDown").value;
var aNameParts;
if (ocgs) {
   for (var i in ocgs) {
       aNameParts = ocgs[i].name.split();
       ocgs[i].state = (aNameParts[0] == "Sec1") && (aNameParts[1] ==event.value) || (aNameParts[1] ==otherDropDownValue);
   }
}

 

  

Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
S
Stevie38923324rffgAuthor
Known Participant
May 22, 2025

Thanks @Thom Parker !

Such a clear response, but I must not understand what exactly I need to rename.

 

So, in the first section, I have 2 drop down menus, named "Model" and "Inner", each with a few choices to select from (which pull-up the layers/pictures). Am i correct that I should rename these fields to something like "Sec1.Model" and "Sec1.Inner" and then the custom validation script, say in the Sec1.Model drop down, would be:

 

var ocgs = this.getOCGs();
var otherDropDownValue = this.getField("Sec1.Inner").value;
var aNameParts;
if (ocgs) {
for (var i in ocgs) {
aNameParts = ocgs[i].name.split();
ocgs[i].state = (aNameParts[0] == "Sec1") && (aNameParts[1] ==event.value) || (aNameParts[1] ==otherDropDownValue);
}
}

 

I have that code in both Sec1.Model and Sec1.Inner (swapping each other's name), and the other 2 sections have no code at all yet, but I couldn't get the first section to pull-up any pictures this way. Please let me know what I'm doing wrong. Thanks so much!

PDF Automation Station
Community Expert
PDF Automation StationCommunity Expert
Community Expert
April 11, 2025

That's because your script is looping through all layers and setting the states based on the result of (ocgs[i].name==event.value) (true or false) so they will all be turned off by the script except the one that matches the value of the dropdown.  Rewrite both scripts like this:

var ocgs = this.getOCGs();
if (ocgs) {
for (var i in ocgs) {
if (ocgs[i].name==event.value)
{ocgs[i].state=true}
}
}
PDF Automation Station
Community Expert
PDF Automation StationCommunity Expert
Community Expert
April 11, 2025

Use @Thom Parker 's script.  Mine doesn't turn off any layers.

Thom Parker
Community Expert
Thom ParkerCommunity Expert
Community Expert
April 11, 2025

Note that in your code all (OCG) layers are included in the loop. So the state of all layers is set, and only the one that matches the selection will be made visible.   

To use two or more dropdowns to select other layers to be visible you must include all dropdowns in any code that makes the layers visible. 

Here's a simple modification of your code. It needs to be done for both dropdowns.

var ocgs = this.getOCGs();
var otherDropDownValue = this.getField("OtherDropDown").value;
if (ocgs) {
   for (var i in ocgs) {
       ocgs[i].state = (ocgs[i].name==event.value) || (ocgs[i].name==otherDropDownValue);
   }
}

 

 

 

Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
S
Stevie38923324rffgAuthor
Known Participant
April 11, 2025

Thanks Thom,

Just to confirm, the only modification I need to make to the formula you entered is on the second line, where I'll write the name of my drop down menu in the quotations? And then I copy the same exact formula into the second drop down list as well, but again only changing the name of that drop down list on the second line, in quotations? 

 

If I have that right, after entering the code into just the first drop down, the pictures/layers did no go away when I selected another option within that drop down; they just kept stacking on top of each other. But then when I added the code into the second drop down menu, I had the same original problem; the picture/layer from the first drop down menu disappeared and I could only see the picture/layer(s) from the second drop down.  I'm doing something wrong, but I'm not sure what 🙂

Thom Parker
Community Expert
Thom ParkerCommunity Expert
Community Expert
April 11, 2025

Yes, you have it correct.  I'm not sure the issue.  The "state" is set to true if either of the dropdown selections match the OCG name.   There must be something else going on for the states to stick when not selected. 

 

Can you post the form, or the exact code used in the dropdown validate event.  

Are the OCG states changes anywhere else in the PDF?

 

Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices