Skip to main content
Participating Frequently
October 30, 2014
Answered

Create a dynamic dropdown field in Adobe Acrobat Pro XI

  • October 30, 2014
  • 5 replies
  • 76753 views

Hello all. I am trying to create a field in one of my forms using Adobe Acrobat Pro XI. I have a dropdown list of "main" items, and based on what is selected in that list, I want a second dropdown list to give different choices. I have searched and searched and have javascript that I thought might work, but maybe I am have a mistake or I am placing the javascript in the wrong place, becasue it is not working. I know very, very little about javascript, so any help would be so much appreciated.

I am using Adobe Acrobat Pro XI. I added a "new field", and selected "dropdown". The field name is ProvType. The dropdown options are:

     Inpatient

     Outpatient

     Physician

I have the "Commit selected value immediately" selected.The field is not validated. The format is "none." There are no actions or calculations associated with it.

I then created another dropbox, and named it SubProvType. Under Actions, I selected the trigger as Mouse Up, and then selected the Action "Run a JavaScript." I selected the add button, and typed this in the JavaScript editor:

switch (ProvType.rawValue)

{

    case "Inpatient":

        this.setItems("Hospice,Hospital,Nursing Facility");

        break;

    case "Outpatient":

        this.setItems("Adult Day Center,Home,Other");

        break;    

    case "Physician":

        this.setItems("Surgeon,Family Practice,Neurologist");

        break;    

}

What I want to happen is:

If "Inpatient" is selected, I want the following options to be available in the second dropdown box "SubProvType":

     Hospice

     Hospital

     Nursing Facility

If "Outpatient" is selected, I want the following options to be available in the second dropdown box "SubProvType":

     Adult Day Center

     Home

     Other

If "Physician" is selected, I want the following options to be available in the second dropdown box "SubProvType":

     Surgeon

     Family Practice

     Neurologist

However.... when I close the form editing and try to select a different option in the ProvType field, the SubProvType field remains blank and there are no options available. There are also no errors.

I must be missing something, but I have no idea where to start. Thank you in advance for any help anyone can provide.

Correct answer try67

Use this code as the custom validation script of ProvType (and remove any code you associated with SubProvType):

switch (event.value) {

    case "Inpatient":

        this.getField("SubProvType").setItems(["Hospice,Hospital,Nursing Facility"]);

        break;

    case "Outpatient":

        this.getField("SubProvType").setItems(["Adult Day Center,Home,Other"]);

        break;  

    case "Physician":

        this.getField("SubProvType").setItems(["Surgeon,Family Practice,Neurologist"]);

        break;  

}

5 replies

New Participant
November 20, 2019

Hello, 

I have tried to follow the code and just rename the fields in my doc, but i am missing some pieces.

 

I have a main Field menu "Provider" and if i choose the option "5 - Hospital"  want to be able to choose between different hospitals from second menu "Hospital", where i have like 12 different hospitals.

 

If i choose other option the 5 - Hospital, i dont want the workers to see that second menu with hospitals in it.

 

This is the code i have tried:

switch (event.value) {

case "5 - Hospital":

this.getField("Hospital").setItems(["-","35600","35601","35602"]);

break;

}

 

Even if i choose option 3 -Customer for example, i can still see the fields with hospitals in it.

 

Is there an easy fix for this? It should be really easy but somehow i cant crack it.

Enclosing picture of that as well

 

 

Thank you

Bernd Alheit
Adobe Expert
November 20, 2019

You can show/hide the field "Hospital".

New Participant
November 20, 2019

Would this code be correct for that?

case "1 - Customer":

          this.getField("Hospital").display=display.hidden

          break;

     case "2 - Shop":

          this.getField("Hospital").display=display.hidden

          break;

 

Somehow it hides the field Hospital completely and i cant see it anymore. Im sorry im a dummie and i ve been looking all over tutorials for last 2 hours but still didnt manage

 
New Participant
January 7, 2019

I am trying to do something somewhat similar, but when you get the second drop down menu and make a selection,  I would like a set of questions to populate on the next page that correlates to the answer chosen in the drop down menu.  Hope that makes sense?

For example, First drop down menu you select FCBC and then the sub menu could populate PT, Dentist, Ambulance, etc, etc, and when the PT selection was chose you would get a populated set of PT questions on the next page, or if Dentist was chosen, then dentist questions, etc, etc.   

try67
Adobe Expert
January 7, 2019

It's possible, but both things will work independently of each other. You will have one script to populate the second drop-down with options dependent on the selection in the first, and another to populate or show/hide the question fields based on the selection in the second drop-down field.

New Participant
January 7, 2019

Do you happen to know how to write the script?

New Participant
October 15, 2015

Thank you to everyone in this thread, this saved me much frustration.

I was curious, is it possible to allow this validate script to edit multiple dropdowns. Meaning, dropdown 1 sets the contents of dropdown 2, however, can I make it so dropdown 1 sets the contents of dropdown 2, 3, 4 (dropdown 2, 3, and 4 would all have identical contents)? I understand I could do this by copying and pasting the "this.getField("XXX")" line and changing the field name every time. But, if there are say 10+ fields that I want a dropdown to effect, this can be cumbersome.

Thank you!

try67
Adobe Expert
October 16, 2015

Sure, that's possible. Just add more lines with the appropriate setItems command.

New Participant
October 16, 2015

Hi try67,

Presently I create an array of what items I want in "setItems". This is what I have so far:

    case "P1": 

        this.getField("preflight.0.0").setItems(private);

        this.getField("preflight.1.0").setItems(private);

        this.getField("preflight.2.0").setItems(private);

        this.getField("preflight.0.1").setItems(private);

        this.getField("preflight.1.1").setItems(private);

        this.getField("preflight.2.1").setItems(private);

        this.getField("preflight.0.2").setItems(private);

        this.getField("preflight.1.2").setItems(private);

        this.getField("preflight.2.2").setItems(private);

Could this be consolidated onto one line perhaps? Just curious!

Thank you for your prompt reply!!

oagidahoAuthor
Participating Frequently
October 30, 2014

I am still having no luck. I have read Thom Parker's Programming List and Combo fields part 1 and have tried to follow the AcroForm document example that he used in the tutorial to make my form work, but the tutorial example is so much more complicated than the 2 fields that I need, and I cannot follow it. His documentation is awesome, but I just can't wrap my head around it. I am now guessing that this must not be as simple as adding a JavaScript action to a field in Acrobat :/ Are there any other suggestions or code that someone might be willing to help me with?

I did find a forum question, Auto-Filling a Drop down List with a Drop down List (JavaScript), that had an answer also by Thom Parker, that stated it would work with something simple:

var oSelListItems = {"aa":[1,2,3,4], "bb":[5,6], "cc":[7,8,9]};

However, I still am unsure where to add this, or if this is all the form will need. (The first part of the tutorial example no longer exists on that site, so I could not follow along.) Does anyone know if this would work for my scenario?

Thanks again in advance for any help and/or coding anyone can pass along.

try67
try67Correct answer
Adobe Expert
October 30, 2014

Use this code as the custom validation script of ProvType (and remove any code you associated with SubProvType):

switch (event.value) {

    case "Inpatient":

        this.getField("SubProvType").setItems(["Hospice,Hospital,Nursing Facility"]);

        break;

    case "Outpatient":

        this.getField("SubProvType").setItems(["Adult Day Center,Home,Other"]);

        break;  

    case "Physician":

        this.getField("SubProvType").setItems(["Surgeon,Family Practice,Neurologist"]);

        break;  

}

oagidahoAuthor
Participating Frequently
October 31, 2014

Gilad D...THANK YOU SO MUCH! With a little modification, this is working perfectly!

I modified the setItems so that they would come up as individual items on the second dropdown list:

switch (event.value) {

    case "Inpatient": 

        this.getField("SubProvType").setItems(["Hospice","Hospital","Nursing Facility"]); 

        break; 

    case "Outpatient": 

        this.getField("SubProvType").setItems(["Adult Day Center","Home","Other"]); 

        break;    

    case "Physician": 

        this.getField("SubProvType").setItems(["Surgeon","Family Practice","Neurologist"]); 

        break;    

}

I can't thank you enough! Now I have this working and I can build from it, adding (many) new main and sub types (there are around 80), and also figure out how to have a "-----" (none) selected, but I am confidant I can do that. Thank you again so much!

try67
Adobe Expert
October 30, 2014

Is this an LCD form?

oagidahoAuthor
Participating Frequently
October 30, 2014

Gilad D... no, I am creating the form in Adobe Acrobat XI Pro.

try67
Adobe Expert
October 30, 2014

Then you have quite a few mistakes in your code. First of all, to access a field you must use the getField method. Also, there's no such property called rawValue. You should use value or valueAsString. Also, the setItems method takes an array of strings as its single parameter, not multiple string parameters.