Skip to main content
J
Jon Bull
Participating Frequently
June 27, 2019
Question

Dropdown selection makes image appear

  • June 27, 2019
  • 2 replies
  • 1885 views

I have a form where I would like the selection from a dropdown list to make an associated image appear. For example, a dropdown list with Meg, Jane, Chris and Trevor. Selecting 'Meg' would have the photo of Meg appear but not the other three. Selecting 'Jane' would make Meg's photo disappear and Jane's appear.

The form has previously just had two names, so I've been using radio buttons. I've had the images as button fields set to 'hidden', then clicking Meg's radio button would make Meg's button 'visible' and Jane's 'hidden', and vice versa for Jane.

I now have another two names to add to this situation, so the radio buttons are going to be too messy and crowded, hence the need for a dropdown, but I don't know how to make it function. I know Javascript is going to be needed but I don't know nearly enough to be able to extrapolate from what I've found, least of all how and where to apply it to a PDF form.

(Alternatively, the images are in fact signatures. I know digital signatures exist, but my client doesn't want this, rather they want something that will print as their actual signature. If an image file of someone's scanned signature can be used in place of Adobe's autogenerated digital signature, that would be the ideal solution.)

Thanks all!

Anna

This topic has been closed for replies.

2 replies

try67
Community Expert
try67Community Expert
Community Expert
June 27, 2019

As mentioned, you can place the images as the icons of button fields, and then show/hide them using a simple script.

See this tutorial for more details: https://acrobatusers.com/tutorials/show_hide_fields

J
Jon BullAuthor
Participating Frequently
July 1, 2019

Yes, that's what I've been doing as mentioned in the question--all those scripts you've linked are only relevant for radio buttons and checkboxes, not dropdown lists.

How do I make each option on the dropdown list show/hide the relevant images?

try67
Community Expert
try67Community Expert
Community Expert
July 1, 2019

The basic code is the same, it just needs to be tweaked a bit.

For example, if the image of Meg is a button field called "Image_Meg" you can use this code as the custom validation script of your drop-down:

this.getField("Image_Meg").display = (event.value=="Meg") ? display.visible : display.hidden;

Bernd Alheit
Community Expert
Bernd AlheitCommunity Expert
Community Expert
June 27, 2019

You can use images in field buttons.

J
Jon BullAuthor
Participating Frequently
July 1, 2019

Yes, that's what I've been doing as mentioned in the question. I've been using radio buttons to control the show/hide in previous versions of the form, but now there are too many options to neatly fit radio buttons in the space so I need to perform the same show/hide function with a dropdown list.

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