Show/Hide layer field based on dropdown box selection

[Stephnie5ED3]

Hi there, I have a form with three layers. The full form is on one layer and layer 2 and layer 3 have additional form fields that I want to displayed depending on the choice made in the dropdown. Can anyone please assist me? I have very basic Javascript skills. Much appreciated!

[try67 · Accepted solution]

Seems fine to me... Are you sure all the layer names and the values of the drop-down field are EXACTLY correct? Even a single space in the wrong place, or a lower-case letter instead of an upper-case one will cause it to malfunction.

If you still can't get it to work, share the file for further help.

[try67]

You can use this code as the custom Validation script of the drop-down field to show "Layer 2" when "Option 2" is selected (and hide it otherwise) and "Layer 3" when "Option 3" is selected:

var ocgArray = this.getOCGs();
for (var i=0; i < ocgArray.length; i++) {
	if (ocgArray[i].name=="Layer 2") ocgArray[i].state = (event.value=="Option 2");
	else if (ocgArray[i].name=="Layer 3") ocgArray[i].state = (event.value=="Option 3");
}

Note, however, that the visibility state of layers is not saved with the file, so if these layers are set to be hidden by default and the user selected one of these two options (which caused the matching layer to appear), and then save the file, closed it and re-opened it, they would both still be hidden. In order to fix that you would need a more complex solution where the visibility state of the layers is saved to a text field (or a metadata property) when the file is saved, and then read and applied when it is opened.

Edit: fixed a small mistake in the code

[Celtexan]

Hello Try67,

I have a similar situation where I have a dropdown selection of five different answers to a question, and if any of the last three are selected, then it is to show the layer. I have tried the code in two ways: "||" between the selections or "if else". Neither of them works. I am still a greenhorn at Scripting in Acrobat but improving.

var ocgArray = this.getOCGs();
for (var i=0; i < ocgArray.length; i++) {
if (ocgArray[i].name=="Layer 2") ocgArray[i].state = (event.value=="Acceptable"||"Needs Improvement"||"Poor");
}

var ocgArray = this.getOCGs();
for (var i=0; i < ocgArray.length; i++) {
if (ocgArray[i].name=="Layer 2") ocgArray[i].state = (event.value=="Acceptable");
else if (ocgArray[i].name=="Layer 2") ocgArray[i].state = (event.value=="Needs Improvement");
else if (ocgArray[i].name=="Layer 2") ocgArray[i].state = (event.value=="Poor");
}

[try67]

Neither of your codes will work correctly. Try this:

if (ocgArray[i].name=="Layer 2") ocgArray[i].state = (event.value=="Acceptable" || event.value=="Needs Improvement" || event.value=="Poor");

[Celtexan]

Hello Try67,

Well, I found it after it dawned on me that you need the "eventvalue==" for each item with the '||" between them. I got it to work. Thanks for your post!

[Susana28817892c4yh]

Hi Try67,

I have a similar situation that I need help with. I have a a total of 4 layers. What I'm trying to see is if I can open a layer based off of State selection on a dropdown menu. There are 21 states that are associated with Layer 1, 4 states with Layer 2, 2 states with Layer 3, and 2 states with Layer 4. The goal is to be able to choose a state that's listed on the drop-down menu, and have the associated Layer automatically appear while keeping the other layers hidden. If the Layer is prepared and fillable, will that change once the layer is unhidden?

[try67]

You can use the same basic code provided above, although for that many items I would use an array and the indexOf method to search it for an item. What do you mean by "If the Layer is prepared and fillable", though?

[Shawn21800473kqsz]

Hello Try67,

I have a similar style form, however I have 4 options and 4 layers. When option 1 is selected, I need to show layer 1. Option 2, layer 2. Option 3, layer 3. Option 4, layer 4. 

The code you provided works well for the first two options and layers, however where I am getting stuck is with Option's 3 and 4. I tried continuing on with an additional "else if" for each option/layer, but that doesn't seem to work. Can you explain how to add additional row of code to make this work?

[try67]

Post your code, please.

[Shawn21800473kqsz]

var ocgArray = this.getOCGs();

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

                if (ocgArray[i].name=="Standard Terms & Conditions") ocgArray[i].state = (event.value=="Standard Terms & Conditions Apply");

                else if (ocgArray[i].name=="Supplier Terms & Conditions") ocgArray[i].state = (event.value=="Suppliers Terms & Conditions Apply");

                else if (ocgArray[i].name=="Supplier Terms & Conditions with Exceptions") ocgArray[i].state = (event.value=="Suppliers Terms & Conditions with Exceptions Apply");

                else if (ocgArray[i].name=="Subcontract Agreement Terms & Conditions") ocgArray[i].state = (event.value==" Subcontract Agreement Terms & Conditions Apply ");

}

[try67 · Accepted solution]

Seems fine to me... Are you sure all the layer names and the values of the drop-down field are EXACTLY correct? Even a single space in the wrong place, or a lower-case letter instead of an upper-case one will cause it to malfunction.

If you still can't get it to work, share the file for further help.

[Shawn21800473kqsz · Accepted solution]

Thank you for the help! I found the error. There was indeed an extra space when I created the layers in indesign that I didn't copy correctly into the code.