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

More than 2 linked dropdowns

Avatar

Level 2

Ok,

Here is the question, I have a form with the following dropdowns:

Type:

Series:

Style:

What I need to have happen is The selection in Type drives what is populated in Series, then the selection in Series drives what is populated in Style.  I have the script on the change event which lets the Type drive the Series, but I cannot figure out how to script the Series to drive the Style.

Here is the script I used for the Type and Series functionality which works:  (Broadloom and Carpet Tile are entered as List Items on the Type DDL)

----- form1.#subform[0].Subform1.DropDownList2::change: - (JavaScript, client) ---------------------

DropDownList3.clearItems();

var sNewSel = this.boundItem(xfa.event.newText);

switch (sNewSel)

{

case "Broadloom":

DropDownList3.addItem("Thunder")

break;

case "Carpet Tile":

DropDownList3.addItem("Not Available")

break;

default:

break;

}

Please any help would be appreciated.

1 Accepted Solution

Avatar

Correct answer by
Level 10

Hi Ken,

There is another example here that is mainly talking about null display patterns for dropdowns, but it also uses the preOpen event. http://assure.ly/gcXx03.

If you have a look at the script in the preOpen event of the Relationship dropdown, you will see that it looks back at the value of the Gender dropdown.

Can you follow the approach? Don't worry about all of the other script, just look at the preOpen event.

Niall

View solution in original post

8 Replies

Avatar

Level 10

Hi,

The best event for populating items in a dropdown is the preOpen event.

  • Type will not contain any script.
  • Series will have script in the preOpen that looks back at Type.rawValue
  • Style will have script in the preOpen that looks back at Series.rawValue

There is an example here: http://assure.ly/jcTahK.

Hope that helps,

Niall

Avatar

Level 2

Thanks Niall -

I have seen this example before but assumed it didn't relate to what I was doing because the dropdown is driven by selections made on a check box. If this can translate to a dropdown that's great, but I am not sure how to adapt the script to do so.

Can you help with that?

Ken Lahvic | Jr. Business Systems Helpdesk Analyst | Empire Today, LLC | Office: 847.583.4441 |Cell: 630-854-2225|

Avatar

Correct answer by
Level 10

Hi Ken,

There is another example here that is mainly talking about null display patterns for dropdowns, but it also uses the preOpen event. http://assure.ly/gcXx03.

If you have a look at the script in the preOpen event of the Relationship dropdown, you will see that it looks back at the value of the Gender dropdown.

Can you follow the approach? Don't worry about all of the other script, just look at the preOpen event.

Niall

Avatar

Level 2

Thanks again,

I hope this is my final question, but does this same process work for a third drop down dependant on what is selected in the second dropdown? The code worked for me for the second, but I am not sure about the third.

Ken Lahvic | Jr. Business Systems Helpdesk Analyst | Empire Today, LLC | Office: 847.583.4441 |Cell: 630-854-2225|

Avatar

Level 2

I answered my question...Yes it does!!!!!! Thank you so much for your help....

Ken Lahvic | Jr. Business Systems Helpdesk Analyst | Empire Today, LLC | Office: 847.583.4441 |Cell: 630-854-2225|

Avatar

Level 10

That's correct! ... I see you have it working already

One last bit of script that you may wish to consider, is in the exit events of Type and Series. Basically because the options in the subsequent dropdowns are dependant on these dropdown, if the user goes back and selects a new Type, the previously selection in Series may now be incorrect.

In the exit event of Type dropdown, I would have something like:

Series.rawValue = null;

Series.clearItems();

Style.rawValue = null;

Style.clearItems();

Then simply in the exit event of Series dropdown, I would have something like:

Style.rawValue = null;

Style.clearItems();

Hope that helps,

Niall

Avatar

Level 2

That's a good point, if someone were to select a new type after they already went and selected previously, it would be nice if the series and style clear when a new type is chosen.

The script you provided I assumed would do that, but when I add it to the exit events of both dropdowns and tested it, nothing happens. Is this supposed to clear the values selected in the dropdowns Series and Style if type were to change?

If not, what exactly does this code do, and is there code to do what I described in paragraph two above?

Thanks again for all your help.

Ken Lahvic | Jr. Business Systems Helpdesk Analyst | Empire Today, LLC | Office: 847.583.4441 |Cell: 630-854-2225|

Avatar

Level 10

Yes Ken,

That is the intention, to clear the other dropdowns, so that incorrect information can not be inadvertantly shown.

I suspect that the references to the objects is not correct. I have just used generic terms "Series", "Styles", you would need to replace these with the actual dropdown names.

When debugging in Preview or with the form open in Acrobat, press Control + J. This will open the JavaScript Console and as you interact with the dropdowns, if there is a problem with the script it should show up there:

Javascript Console.png

Also check that the language in the exit events is set to JavaScript.

Hope that helps,

Niall