Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Show Hide dropdown field on selection in another dropdown field

Avatar

Level 2

Hello I need to create two dropdown fields on a dynamic PDF in LiveCycle. The first field contains three choices. When a user chooses an item in the first dropdown I would like a new dropdown field to been shown. For each item in the first dropdown a new dropdown field with unique values will be shown. If the user chooses Blue the Blue Shades dropdown will show in that dropdown will be various shades of blue to choose for. If Red is chosen, Shades of Red dropdown with appear and if Yellow is shown the same will occur. Also if the user has to go back and change their selection in the first dropdown they can do that as well. Any suggestions?

Thank you in advance.

1 Accepted Solution

Avatar

Correct answer by
Level 7

There are 2 ways you could do this. The first is just to have 3 seperate dropdown boxes for the second box and have them all hidden. The exit event of the first dropdown would then have code that would make the appropriate second box become visible, something like (in formcalc):

if ($ == 1) then

dropdownRed.presence = "visible"

dropdownBlue.presence = "hidden"

dropdownYellow.presence = "hidden"

elseif ($ == 2) then

dropdownRed.presence = "hidden"

dropdownBlue.presence = "visible"

dropdownYellow.presence = "hidden"

elseif ($ == 3) then

dropdownRed.presence = "hidden"

dropdownBlue.presence = "hidden"

dropdownYellow.presence = "visible"

endif

The other option is just to have one dropdown box which dynamically changes its options depending on the results of the first box. So in the preOpen event of the second box you could have something like (in formcalc):

if (dropdown1 == 1) then

$.clearItems()

$.setItems("Light red, dark red")

elseif (dropdown1== 2) then

$.clearItems()

$.setItems("light blue, dark blue")

elseif (dropdown1== 3) then

$.clearItems()

$.setItems("light yellow, dark yellow")

endif

View solution in original post

2 Replies

Avatar

Correct answer by
Level 7

There are 2 ways you could do this. The first is just to have 3 seperate dropdown boxes for the second box and have them all hidden. The exit event of the first dropdown would then have code that would make the appropriate second box become visible, something like (in formcalc):

if ($ == 1) then

dropdownRed.presence = "visible"

dropdownBlue.presence = "hidden"

dropdownYellow.presence = "hidden"

elseif ($ == 2) then

dropdownRed.presence = "hidden"

dropdownBlue.presence = "visible"

dropdownYellow.presence = "hidden"

elseif ($ == 3) then

dropdownRed.presence = "hidden"

dropdownBlue.presence = "hidden"

dropdownYellow.presence = "visible"

endif

The other option is just to have one dropdown box which dynamically changes its options depending on the results of the first box. So in the preOpen event of the second box you could have something like (in formcalc):

if (dropdown1 == 1) then

$.clearItems()

$.setItems("Light red, dark red")

elseif (dropdown1== 2) then

$.clearItems()

$.setItems("light blue, dark blue")

elseif (dropdown1== 3) then

$.clearItems()

$.setItems("light yellow, dark yellow")

endif

Avatar

Level 2

Thank you so very much, I used the first option and it works perfectly.