How to Make a PDF Form URL Field Clickable with JavaScript
Question details
The user wants to allow respondents to enter a web address into a PDF form text field and then open that address in a browser by clicking on the same field.
- Product
- PDF Editor
- Device & OS
- not provided
- Scenario
- Creating an interactive PDF form where user-inputted URLs automatically become clickable hyperlinks.
- Observed behavior
- The creator needs a method to dynamically launch a URL based on the text value entered into the form field.
Ensure you are using a PDF editing tool that supports form field creation and custom JavaScript execution, such as Adobe Acrobat Pro or WPS PDF.
Configure a MouseUp JavaScript Action in the Form Field
Use a simple JavaScript command triggered by a MouseUp event to read the field's text and launch it as a web link.
By assigning a custom script to the MouseUp event, the PDF reader will evaluate the contents of the text field whenever it is clicked. If the field is not empty, the application will attempt to open the entered text as a web URL.
Open your PDF document in form editing mode and double-click the target text field to open its Properties dialog box.
Click on the 'Actions' tab at the top of the Properties window.
From the 'Select Trigger' dropdown menu, choose 'Mouse Up'. From the 'Select Action' dropdown menu, choose 'Run a JavaScript', and then click the 'Add' button.
In the JavaScript Editor window, paste the following code: if (event.target.valueAsString != "") app.launchURL(event.target.valueAsString);
Click 'OK' to save the script, then close the Properties dialog. Exit form editing mode, enter a valid URL into the field, and click it to ensure the web page opens correctly.
Create Interactive PDF Forms with WPS Office
Easily build interactive PDF forms, add fillable text fields, and manage document interactivity using WPS Office. Enjoy a lightweight and user-friendly alternative for all your daily PDF and document needs.
- 1. Download and Install: Download WPS Office Free from the official website and install it on your device.
- 2. Open Your Document: Launch WPS PDF and open the document you wish to convert into an interactive form.
- 3. Insert Form Fields: Navigate to the 'Form' tab to insert text fields, checkboxes, or buttons directly into your document.
- 4. Adjust Properties: Double-click your newly created fields to adjust formatting, set default values, and finalize your interactive PDF.
Frequently Asked Questions
Why doesn't the URL open when I click the text field?
Ensure you have exited form-editing mode. JavaScript triggers like 'MouseUp' only execute when you are in the standard viewing or preview mode of your PDF reader.
Does the user need to type 'https://' for the link to work?
Yes, the app.launchURL() JavaScript method typically requires a fully qualified URL, including the protocol (http:// or https://), to successfully route the link to your default web browser.
Will this JavaScript action work on all PDF viewers?
Most major desktop PDF readers, including Adobe Acrobat and WPS PDF, support standard JavaScript actions. However, some mobile PDF viewers or lightweight web browser extensions may restrict or ignore JavaScript execution for security reasons.
