Skip to main content
D
Devon26135825tarp
Participating Frequently
January 15, 2025
Answered

DropDown text that shows images | Help Optimizing Script

  • January 15, 2025
  • 2 replies
  • 776 views

Like the title says, I have a dropdown box that shows stacked images when the text is called. All images are hidden until visible. Here is my code:

if (event.value == "Alto") {
    this.getField("unit_info_type").value = "Mech";
    this.getField("alto").display = display.visible;
    this.getField("portanova").display = display.hidden;
    this.getField("revernova").display = display.hidden;

} else if (event.value == "Portanova") {
    this.getField("unit_info_type").value = "Mech";
    this.getField("alto").display = display.hidden;
    this.getField("portanova").display = display.visible;
    this.getField("revernova").display = display.hidden;

} else if (event.value == "Revernova") {
    this.getField("unit_info_type").value = "Mech";
    this.getField("alto").display = display.hidden;
    this.getField("portanova").display = display.hidden;
    this.getField("revernova").display = display.visible;

} else {
    this.getField("unit_info_type").value = "";
    this.getField("alto").display = display.hidden;
    this.getField("portanova").display = display.hidden;
    this.getField("revernova").display = display.hidden;

}

I have about 20+ more images I need to add so my questions is, how can I better clean this up?

Correct answer Thom Parker

Another option is to use field naming to make the code more efficient. Doing this way also means that it is easy to add and remove fields without changing any code, becuase it's all in the name. 

For example:

Name the image fields like this: "images.Portanova", "images.Revernova",

 

To handle the extra information in "unit_info_type" field", place it in the tooltip text for the image field.

Then this code will work for any number of image fields. 

 

// Hide all image fields
this.getField("images").display = display.hidden;

// Unhide the selected field
this.getField("images." + event.value).display = display.visible;

// Add unit info type data
this.getField("unit_info_type").value = this.getField("images." + event.value).userName;

 

With this method you can add, change, and remove images without changing any code. 

 

2 replies

Thom Parker
Community Expert
Thom ParkerCommunity ExpertCorrect answer
Community Expert
January 15, 2025

Another option is to use field naming to make the code more efficient. Doing this way also means that it is easy to add and remove fields without changing any code, becuase it's all in the name. 

For example:

Name the image fields like this: "images.Portanova", "images.Revernova",

 

To handle the extra information in "unit_info_type" field", place it in the tooltip text for the image field.

Then this code will work for any number of image fields. 

 

// Hide all image fields
this.getField("images").display = display.hidden;

// Unhide the selected field
this.getField("images." + event.value).display = display.visible;

// Add unit info type data
this.getField("unit_info_type").value = this.getField("images." + event.value).userName;

 

With this method you can add, change, and remove images without changing any code. 

 

Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
    D
    Devon26135825tarpAuthor
    Participating Frequently
    January 16, 2025

    All I would need to do is copy that in as is?

     

    Also, if there is additional unit info would I be able to just copy/paste the last line with the names of that info?

    D
    Devon26135825tarpAuthor
    Participating Frequently
    January 16, 2025

    Just to be transparent,

     

    Each dropdown name will have an image, a type, an accuracy base stat value, an assault base stat value, and an evasion base stat value.

    This script work great, but how easily would I be able to add those additional 3 values to each name/image that is made visible?

    try67
    Community Expert
    try67Community Expert
    Community Expert
    January 15, 2025

    You can use something like this:

     

     

    var imageFields = ["alto", "portanova", "revernova"];

for (var i=0; i<imageFields.length; i++) {
    this.getField(imageFields[i]).display = (event.value.toLowerCase()==imageFields[i].toLowerCase()) ? display.visible : display.hidden;
}

if (event.value==event.target.defaultValue)
	this.getField("unit_info_type").value = "Mech";
else this.getField("unit_info_type").value = "";

     

     

    This assumes the names of the fields match the values in the drop-down (except for case). If that's not always the case a more complex script will be needed, so I suggest you make sure it does.

     

    [Edit: small mistake in the code fixed]

    D
    Devon26135825tarpAuthor
    Participating Frequently
    January 15, 2025

    Thank you!

     

    Would I need to change the buttons that im using as icons to image field instead?

    try67
    Community Expert
    try67Community Expert
    Community Expert
    January 15, 2025

    No, and they are the same thing anyway.

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices