• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers

Hide text field if checkbox is checked

Explorer ,
Jul 24, 2020 Jul 24, 2020

Copy link to clipboard

Copied

 

Please help! Here's my scenario.........

CHECKBOX1:  User is instructed that if Account signers are exactly the same as on a prior page, then check the box.  If an signers are different, then user is to complete textbox1 thru textbox8, as needed.  I want to prevent user from checking box AND then filling text boxes (and yes, some would try that!)

 

So......If checkbox1 is checked, then text1 thru text8 are "hidden", if checkbox1 is subsequently unchecked, then text1 thru text8 are returned to "visible".  Checkbox will be unchecked in published form.

 

TIA - Michelle

 

TOPICS
Acrobat SDK and JavaScript

Views

11.0K

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
community guidelines

correct answers 1 Correct answer

Community Expert , Jul 25, 2020 Jul 25, 2020

That works, but you can cut the length of the code by half by doing it like this:

 

var nDisplay = event.target.isBoxChecked(0) ? display.visible : display.hidden;
this.getField("Text1").display = nDisplay;
this.getField("Text2").display = nDisplay;
this.getField("Text3").display = nDisplay;

 

And if the field names are indeed those then it can be cut even further by using a loop.

Likes

Translate

Translate
Community Expert ,
Jul 25, 2020 Jul 25, 2020

Copy link to clipboard

Copied

Hi,

 

You should be able to use a script similar to below on the up action of the checkbox, and select run a JavaScript.

 

if ( event.target.isBoxChecked(0)) {
    this.getField("Text1").display = display.visible;
    this.getField("Text2").display = display.visible;
    this.getField("Text3").display = display.visible;
} else {
    this.getField("Text1").display = display.hidden;
    this.getField("Text2").display = display.hidden;
    this.getField("Text3").display = display.hidden;
}

 

You will need to add a line for each text field you want to show or hide.

 

Regards

 

Malcolm

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
community guidelines
Community Expert ,
Jul 25, 2020 Jul 25, 2020

Copy link to clipboard

Copied

That works, but you can cut the length of the code by half by doing it like this:

 

var nDisplay = event.target.isBoxChecked(0) ? display.visible : display.hidden;
this.getField("Text1").display = nDisplay;
this.getField("Text2").display = nDisplay;
this.getField("Text3").display = nDisplay;

 

And if the field names are indeed those then it can be cut even further by using a loop.

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
community guidelines
Explorer ,
Jul 27, 2020 Jul 27, 2020

Copy link to clipboard

Copied

Thank you............however I had to switch the var to display.hidden:display.visible to make it work.  Or was there another way?

 

When box is unchecked, then text field needs to be visible to allow entry.  If box is checked, then the text field is hidden.

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
community guidelines
Community Expert ,
Jul 27, 2020 Jul 27, 2020

Copy link to clipboard

Copied

Ah sorry, I had it the other way around...

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
community guidelines
Explorer ,
Jul 27, 2020 Jul 27, 2020

Copy link to clipboard

Copied

HAHA.......I kept getting it confused too!  thanks so much.

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
community guidelines
Community Beginner ,
Aug 01, 2021 Aug 01, 2021

Copy link to clipboard

Copied

I have the same issue and I feel the need to ask a dumb question (I am just starting to JavaScrcipt).  OK here it is:  How do I even insert the code in the firt place, and where does it go?  On mouse button up?  Soory for the stupid question. 

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
community guidelines
Community Expert ,
Aug 02, 2021 Aug 02, 2021

Copy link to clipboard

Copied

LATEST

Watch the videos here, they'll put it all in perspective:

https://www.pdfscripting.com/public/Free_Videos.cfm#JSIntro

 

 

 

Thom Parker - Software Developer at PDFScripting
Use the Acrobat JavaScript Reference early and often

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
community guidelines
Explorer ,
May 11, 2021 May 11, 2021

Copy link to clipboard

Copied

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
community guidelines
Community Expert ,
Jul 26, 2020 Jul 26, 2020

Copy link to clipboard

Copied

Read the article, see the example 🙂  

https://www.pdfscripting.com/public/Hiding-and-Showing-Form-Fields.cfm?sd=40

 

 

Thom Parker - Software Developer at PDFScripting
Use the Acrobat JavaScript Reference early and often

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
community guidelines
Explorer ,
Jul 27, 2020 Jul 27, 2020

Copy link to clipboard

Copied

Thank you Thom.........your article was very helpful and I can see incorporating these scripts into some docs in the near future!

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
community guidelines
New Here ,
Sep 21, 2020 Sep 21, 2020

Copy link to clipboard

Copied

Hello,

 

So I have an interesting issue and I have yet to be able to find a solution using this code. I have a form with the same field name repeated in order to allow for only one check box to be ticked at a time in a grouping.

 

so think of:

Reason For This#0

Reason For This#1

Reason For This#2

 

Each of these fields exports a different value which allows for only one of the tickboxes to be ticked at once. 

 

So export values are:

Reason For This#0- Yes

Reason For This#1- No

Reason For This#2- MaybeSo

 

When I apply the code to Reason For This#0 (Checkbox) I can make the coresponding text field appear and hide. Then when I move down and try to make the same code work for Reason For This#1 it does not work. I thought at first that the variable might be the issuse so I altered it and made #1 m instead of n but that idnd't fix the issue. Any ideas?

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
community guidelines
Community Expert ,
Sep 21, 2020 Sep 21, 2020

Copy link to clipboard

Copied

Please provide your exact code.  However, the "isBoxChecked" function is a bad choice for your sitation, because it relies on providing the correct widget number to acquire the checked state. What you have are basically radiobuttons, so it's best to use a modified radio button technique, i.e. use the export values to determine which text box is chosen. 

Read this article:

https://www.pdfscripting.com/public/Hiding-and-Showing-Form-Fields.cfm?sd=40

 

 

 

Thom Parker - Software Developer at PDFScripting
Use the Acrobat JavaScript Reference early and often

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
community guidelines
Community Expert ,
Sep 21, 2020 Sep 21, 2020

Copy link to clipboard

Copied

If you want checkboxes to act as radio buttons you should name all 3 of them same,like this "Reason For This#0" and leave them export values as is.
You can use this code in each text field as "Custom Calculation Script":
event.target.display = this.getField("Reason For This#0").value == "Yes" ? display.visible : display.hidden;
just change Yes, No, MaybeSo to corresponding 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
community guidelines