How to Show or Hide Acrobat Form Fields Based on Text Input
Question details
The user wants to configure a PDF form to dynamically reveal hidden fields only when specific text is entered into a preceding field.
- Product
- Adobe Acrobat
- Device & OS
- not provided
- Scenario
- Creating interactive PDF forms where conditional logic dictates field visibility.
- Observed behavior
- The form needs to evaluate the text input upon exit and update the display properties of dependent fields accordingly.
Ensure you have Adobe Acrobat Pro or a PDF editor that supports JavaScript for forms, as the standard Acrobat Reader cannot create or edit form scripts.
Use JavaScript to Control Form Field Visibility
Apply a custom JavaScript action to the source field to dynamically change the visibility of dependent fields.
To make a form field appear only when another field has been filled out, you need to use a simple JavaScript condition triggered when the user finishes typing.
Launch Adobe Acrobat, open your PDF document, go to 'Tools', and select 'Prepare Form'.
Right-click the text field where the user will input their text, and select 'Properties' from the context menu.
Navigate to the 'Actions' tab. Choose 'On Blur' (or 'Mouse Exit') from the Select Trigger dropdown. Then, choose 'Run a JavaScript' from the Select Action dropdown, and click the 'Add' button.
In the JavaScript Editor window, enter the following code: var target = this.getField("DependentField"); target.display = event.value.trim() ? display.visible : display.hidden;. Replace 'DependentField' with the actual name of your hidden field, then click 'OK'.
Close the Prepare Form mode to return to the normal viewing mode. Type some text into the source field and click outside of it to verify that the dependent field becomes visible.
Edit and Manage PDF Forms Easily with WPS Office
WPS Office provides a comprehensive PDF editor that allows you to easily fill out interactive forms, edit PDF text, manage document security, and convert PDFs to Word or Excel without hassle.
- 1. Download and Install WPS Office: Download WPS Office for free from the official website and complete the installation process.
- 2. Open Your PDF Form: Launch the WPS PDF tool and open your interactive PDF document.
- 3. Access Form Tools: Navigate to the 'Form' tab on the top ribbon to access form filling and editing tools.
- 4. Fill and Edit: Fill in your interactive fields, add electronic signatures, or modify PDF text as needed.
- 5. Save and Export: Save your updated PDF document securely or export it to other Office formats.
Frequently Asked Questions
Why is my dependent PDF form field not showing up?
This usually happens if there is a typo in the field name within the JavaScript code. Double-check that the field name inside this.getField("FieldName") exactly matches the target field's name in its properties.
Can I hide the field again if the user deletes the text?
Yes, the provided JavaScript uses event.value.trim(). If the user clears the field and clicks away, the condition evaluates to false, and display.hidden is triggered automatically.
Does this JavaScript work in all PDF viewers?
While it works perfectly in Adobe Acrobat and most premium PDF editors, some basic web browsers or default mobile preview apps may not fully support PDF JavaScript actions.
Can I show multiple fields based on one text input?
Yes. You can assign multiple target variables in your JavaScript and set their respective display properties to display.visible within the same script block.
