Highlighted

show/hide fields based on drop down choices

Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

I have a dropdown field with three choices. Based on the selection, I need a specific text form field to appear, and the others to remain hidden. (Or if it makes the code more clean, the resulting field could be a dropdown, too, with the appropriate choice selected.) I don't know Java well enough to extrapolate code from online examples and repurpose it for my forms. I can provide a sample form. Thanks in advance for your help.

There are some ways to execute this.  the easiest for you would be to add this script to the calculate (calculate tab in properties) event of the field that needs to be hidden.  Take notes that everything after "//" is just hints for you to understand the code.  You will need to put this script in every field that you want to replicate the behavior, changing the value according to what you want to accomplish.  the word "event" means myself for you to understand.


if (this.getField("dropdown").value == "put value here"){      //replace "dropdown" with the name of the dropfield

event.target.display = display.visible;

}

else{

event.target.display = display.hidden;

}

This solution works if you have a small amount of fields.  If you manage to have a large number of similar fields, let me know because there are other and faster ways.

Topics

Acrobat SDK and JavaScript, PDF forms, Windows

Views

24.1K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

show/hide fields based on drop down choices

Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

I have a dropdown field with three choices. Based on the selection, I need a specific text form field to appear, and the others to remain hidden. (Or if it makes the code more clean, the resulting field could be a dropdown, too, with the appropriate choice selected.) I don't know Java well enough to extrapolate code from online examples and repurpose it for my forms. I can provide a sample form. Thanks in advance for your help.

There are some ways to execute this.  the easiest for you would be to add this script to the calculate (calculate tab in properties) event of the field that needs to be hidden.  Take notes that everything after "//" is just hints for you to understand the code.  You will need to put this script in every field that you want to replicate the behavior, changing the value according to what you want to accomplish.  the word "event" means myself for you to understand.


if (this.getField("dropdown").value == "put value here"){      //replace "dropdown" with the name of the dropfield

event.target.display = display.visible;

}

else{

event.target.display = display.hidden;

}

This solution works if you have a small amount of fields.  If you manage to have a large number of similar fields, let me know because there are other and faster ways.

Topics

Acrobat SDK and JavaScript, PDF forms, Windows

Views

24.1K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Engaged ,
Jun 11, 2014

Copy link to clipboard

Copied

There are some ways to execute this.  the easiest for you would be to add this script to the calculate (calculate tab in properties) event of the field that needs to be hidden.  Take notes that everything after "//" is just hints for you to understand the code.  You will need to put this script in every field that you want to replicate the behavior, changing the value according to what you want to accomplish.  the word "event" means myself for you to understand.


if (this.getField("dropdown").value == "put value here"){      //replace "dropdown" with the name of the dropfield

event.target.display = display.visible;

}

else{

event.target.display = display.hidden;

}

This solution works if you have a small amount of fields.  If you manage to have a large number of similar fields, let me know because there are other and faster ways.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

I only have a few fields, so hopefully we can make this solution work. I did run into an issue, though.

On the field I want to show/hide, called "14", I entered the following in the "Calculate - Custom Calculation Script" field. "State#1" is the name of the dropdown field and "Pickles" is the choice within that dropdown field.

if (this.getField("State#1").value = "Pickles"){

event.target.display = display.visible;

}

else{

event.target.display = display.hidden;

}

Doing this resulted in the following error messages:

SyntaxError: missing ) after condition 1:

SyntaxError: missing ) after condition 2:

Not sure what to do from here?!? Thanks for your continued help.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jun 11, 2014

Copy link to clipboard

Copied

Change this:

if (this.getField("State#1").value = "Pickles"){

To this:

if (this.getField("State#1").value == "Pickles"){

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

Made that change, now I get the following error.


this.getField("State#1") is null
1:AcroForm:18:CalculateException in line 1 of function top_level, script AcroForm:18:Calculate

TypeError: this.getField("State#1") is null
1:AcroForm:18:Calculate

Is there a place I can post the file, if that would make it easier? Also, why does it need two "=" signs?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jun 11, 2014

Copy link to clipboard

Copied

That means there's no field in your file called "State#1". If you're getting this name from the fields list in Form Edit mode, the "#1" part just means that it's a copy of another field called "State", and that's the name you should use.

In JS, "=" is the assignment operator. "==" is the comparison operator.

You can post the file to a file-sharing website (dropbox, acrobat.com, etc.) and then post the link to it here.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Engaged ,
Jun 11, 2014

Copy link to clipboard

Copied

also, if "==" could be roughly translated to "is", "!=" would mean "is not".

JavaScript is Case sensitive so make sure you did not name your field STATE#1 instead.  It's a pretty common error.  Try not to use special characters when naming fields.  Stick to standards.  I personnally always name fields with capital letters and numbers using identation like

MYFORM.PLACE.NUMBER

MYFORM.PLACE.ADDRESS

MYFORM.SEX.MALE

MYFORM.SEX.FEMALE

This is really useful if you have lots of fields related to one another.  You can then apply methods to entire groups of fields in one simple line of code.

For example this.getField("MYFORM").display = display.hidden would hide all four fields.  It works kind of the same way as folders unside your computer.

Finally, "#" is generally used as widget identification.  I think this is what happened.  If you copy a field, it retains the same name and some of its charateristics but acrobat will assign them a number called widget.  The original field State will get the identification State#0 in the right pane as it is 0-based.  The copie will be identified State#1.  You must understand that the name of the field is still "State".  Some methods (actions you can code) let you determine the widget number for targetting a specific field from those you copied.  It is not the case here.  So for disambiguation, you should name your fields different name like STATE1 and STATE2, or STATE.1 and STATE.2 if you plan to use what I wrote about earlier.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

Thank you for the help and extra information. I was able to get it to work! I definitely need to learn JavaScript.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

Thank you, Gilad D. for the help and extra information, too.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Oct 30, 2017

Copy link to clipboard

Copied

"This solution works if you have a small amount of fields.  If you manage to have a large number of similar fields, let me know because there are other and faster ways."

Can you explain these faster ways please?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
May 31, 2018

Copy link to clipboard

Copied

I'd be interested in alternate ways. Specifically, I notice the Validation code doesn't run when a selection is made from a menu, unless the enter key is pressed. Selecting with a mouse does not trigger the code, nor does adding the code to a mouse Action, which only runs when the field is clicked. Not sure what Mouse Enter refers to, but didn't appear to solve issue.

Basically I want a dynamic field to change as selections are made by any means? Are there any events or actions I can trigger or consume?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
May 31, 2018

Copy link to clipboard

Copied

It will, if you tick the option to commit the selected value immediately, under the field's Properties, Options tab.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
May 31, 2018

Copy link to clipboard

Copied

Thankyou, works perfectly. 🙂

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Engaged ,
May 31, 2018

Copy link to clipboard

Copied

You could use the setItems() method of the field object instead of hiding and showing fields.  The setItems() method will change the choices of a dropdown menu dynamically by inserting the elements of an array as choices

For example, let's say you have 2 dropdown fields named "food.type" and "food.name"

if (this.getField("food.type").value = "fruits"){

   this.getField("food.name").setItems([" ", "Apple", "Oranges", "Bananas"])

}

else if (this.getField("food.type").value = "vegetables"){

   this.getField("food.name").setItems([" ", "Potatoes", "Carotts", "cabbage"])

}

the choice you make in the first field changes what is available in the second field

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jun 01, 2018

Copy link to clipboard

Copied

There are errors in your code. You used the value assignment operator instead of the comparison operator.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Engaged ,
Jun 01, 2018

Copy link to clipboard

Copied

True.thanks

if (this.getField("food.type").value == "fruits"){

   this.getField("food.name").setItems([" ", "Apple", "Oranges", "Bananas"])

}

else if (this.getField("food.type").value == "vegetables"){

   this.getField("food.name").setItems([" ", "Potatoes", "Carotts", "cabbage"])

}

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jun 02, 2018

Copy link to clipboard

Copied

Also, if this is the custom validation script of "food.type" then you should use event.value instead of this.getField("food.type").value .

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
Aug 08, 2020

Copy link to clipboard

Copied

This helped me as well! Thank you so much! Are you familiar how this can be adapted to accomodate  multiple values from one dropdown to trigger one form field to hidden. I tried to repeat the code for other values and does not function or will only function for the last value in the syntax. I am a complete novice so the fix can be easy, but I am not knowledgeble enough. Thank you in advance or any advice.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

So I got it to work, then realized that what I really needed is for a specific value to appear in another form field, based on what is selected in the dropdown. Using my previous example, if the choices in the dropdowns are "WA" and "OR", when "WA" is chosen, I need "18" to appear in a different field and if "OR" is chosen, I need "14" to appear. I hope this makes sense, and again I appreciate any help that you can provide.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Jun 11, 2014

Copy link to clipboard

Copied

You can use this as that field's custom calculation script:

var v = this.getField("Dropdown Field Name").value;

if (v=="WA") event.value = "18";

else if (v=="OR") event.value = "14";

else event.value = "";

Of course, you'll need to adjust the name of the drop-down field...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 11, 2014

Copy link to clipboard

Copied

Thank you so much! Part of me wishes I'd realized what I needed from the outset, but now I have another bit of code that I may be able to utilize.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Engaged ,
Jun 12, 2014

Copy link to clipboard

Copied

Values of "14" and "18" are different than values of 14 and 18.  The reason behind this is numbers alone are interpreted as numbers while numbers between "" are interpreted as a strings of character.  Maybe it doesn't change anything right now but it's good to know the difference.  Let's say you want to make calculations with these numbers, they need to be numbers, not strings.

Luckilly, when you retrieve a value from a field using the getField() method, javascript will interpret it in the most logical way (numbers being numbers) but maybe it's not what you need.

To force a string interpretation, you will use .valueAsString instead of .value OR put the getField() method inside this -->  String(put it here).  The same thing goes with numbers Number(put it here).

You need to be aware of the return value of the methods you use because sometimes, it switches between string, number, array, bollean.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
Jun 13, 2018

Copy link to clipboard

Copied

I have a form with 4 options that dictate the visibility for 75 fields each. You mentioned a different method to control visibility for a large number of fields? I'm using Acrobat Pro DC.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Feb 06, 2019

Copy link to clipboard

Copied

I came across this thread looking for a similar answer on this myself.  Is there an easier way to set this up for multiple fields?  For instance, they first dropdown decision determines the second field, which determines the third, and so on.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Feb 06, 2019

Copy link to clipboard

Copied

This is called "cascading" and is possible, but requires a more complex script and data model.

If you're interested, I've developed a (paid-for) tool that allows you to set it up easily, based on a spreadsheet with the data, and without having to write any code. You can find it here: Custom-made Adobe Scripts: Acrobat -- Create Cascading Dropdowns

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Feb 06, 2019

Copy link to clipboard

Copied

Can you offer any other assistance or advice other than trying to constantly peddle your (paid-for) site and code? Seems to be your go-to response for things like this. While it’s super that you created it, and I’m sure you’re really proud of it based on how often you copy and paste that same response, but for those of us trying to learn and teach ourselves JS, this does nothing for us, and doesn’t teach us anything “without having to write any code”.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Feb 06, 2019

Copy link to clipboard

Copied

You didn't ask any specific question so I didn't give any specific answer... If you want to do it yourself, go for it. If you have problems writing the code I'll (or others) be happy to help you sort it out, but you seem to expect others to do your work for you, for free. That's not how these forums work, usually. If you don't know any JavaScript at all I would say this is too complex a task for a novice. Start with simpler projects and build your way up.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Feb 06, 2019

Copy link to clipboard

Copied

Here's a free article and example file that shows the technique

https://acrobatusers.com/tutorials/js_list_combo_livecycle

I've posted this link about a hundred times to this forum, cause it gets asked all the time. A bit more effort searching the forum would save us all some time.

You'll also find endless info on list programming here.

https://www.pdfscripting.com/public/List-Field-Usage-and-Handling.cfm

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
Aug 08, 2020

Copy link to clipboard

Copied

REMINDER: Please be kind when asking individuals for help or guidance. It is disheartening to see this kind of attitude toward individuals who are taking time to help advance other's skillset. Hoping you found your solution and definately hope you use "thank you" more frequently in your day-to-day.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Feb 08, 2019

Copy link to clipboard

Copied

hoping im not too late here, but i need help with a specific issue.

i have two drop down boxes that i want to make the same value by default, but i need to allow the second field to be editable without adjusting the main dropdown box.

Yes or No1 = Yes  (then Yes or No2 = Yes by default, but can be selected to no)

Yes or No1 = No (then Yes or No2 = No and only no)

Any help would be a appreciated. New to the Java script stuff and could really use all the help i can get.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Feb 08, 2019

Copy link to clipboard

Copied

askytola  wrote

hoping im not too late here, but i need help with a specific issue.

...

Any help would be a appreciated. New to the Java script stuff and could really use all the help i can get.

Read the available material and post your question to a new thread.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Feb 08, 2019

Copy link to clipboard

Copied

i did read above material and even clicked the links you so kindly sent us to with the intent of getting an end user to spend 150$ a year on a membership for basic help. Given knowledge is worth paying for, but to fill a general help thread with what amount as advertisements is petty.

i can definitely open a new thread, but i posted in a thread that i felt most fit my situation after reading multiple different threads.

so please either help someone who is stuck and politely asking for assistance, or move on.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
Feb 08, 2019

Copy link to clipboard

Copied

You can achieve it by using the following code as the custom validation script of your first drop-down field:

this.getField("Name of other field").value = event.value;

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Feb 18, 2019

Copy link to clipboard

Copied

SERIOUSLY!!!! thank you. I know that had to be a "basic" question to anyone who is more than a novice, but the basic help doesn't go unappreciated. Again, seriously, thank you.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Feb 11, 2020

Copy link to clipboard

Copied

askytolaa  I'm sorry to hear you did not find the information at the links useful. In fact, everything was there in the free material and the free example to provide you with the solution had you taken the effort to read the material. This site is about helping people to find the resources they need. Sometimes that means helping debug a script or providing a little code. But we are not here to provide free work. 

 

You are very wrong about wwwpdfscriptingg.com, it is not about basic info. It provides a wealth of advanced information: Samples,Tutorials, Automation tools, Plug-ins, an On-line tools.  Much of the information you literally cannot find anywhere else.  Any one of the free tools is worth the membership price. 

In fact, a great deal of basic info is free on this site. Everything you needed to solve you problem is free. But it takes some reading and thinking to use. You just don't get everything handed to you for free. 

 

I believe you owe me an apologyy. Your post was rude and unfair. 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Resources
One Stop Solution for Acrobat
Edit a PDF