How to make your PDF preview interactive

Last updated Sep 09 2018

When you configure your PDF mapping, you create a Basic or Dynamic template and use the form fields in it. Usually the data entered by the form fillers is simply “poured” into the mould you created, however in the interactive mode the filler can click on the fields inside the preview and change their values.  

In this example we will show you how to create a simple form and make its PDF preview interactive.
Please follow the steps:

1- Create the form:
- create a new form from blank
- Drag a Textbox element and change its label text to Account name




Now do the same with the next 2 fields:
- Drag a Textbox element and change its label text to Account phone
- Drag an Email element and change its label text to Email

- Your end result should look like this:


2- Create the PDF template:
- go to ‘Properties panel’ > ‘Form’ tab > ‘Settings’ option > ‘Pdf Mapping’ category
Press on the ‘Map fields’ button
- Turn the “Dynamic mode” option in the toggle above


- Add your text, and style it a bit
- Use the elements dropdown in the toolbar to add the form field to your PDF template.


- Now add all three fields to your PDF template


3- Configure the PDF settings
Notice that the settings are arranged in 4 categories: General, Buttons and Labels, Email and Condition.
In this example we will only use the ‘General’ category. Read more about all the PDF Settings
- Turn on the ‘Preview before submit’ checkbox.
Please notice that once this option is active a new checkbox will appear - “Interactive mode”
- Turn on the ‘Interactive mode’ checkbox and press on the ‘configure’ button.


A window will open and you will be required to define the interactive mode:
which fields will be interactive inside the PDF preview, if they will be mandatory, if they will inherit their style from the form and if they will be entered in-line.

- Open the dropdown and press on 'add' to make a field interactive.  


- Do this with all three fields.
- Make your account name field mandatory


- Press ‘Apply’ a few times and finally save your form.

4- Test your form
- publish your form as URL
- Since none of the form fields are marked as mandatory you don't really have to enter any data in them, but just for the example:
enter an email address: johndoe@formtitan.com
 

- Now simply press ‘submit’ to open the PDF Preview window.
- The PDF will then be presented, including the email you just entered and you will be able to change the email as well as enter data in the other two fields.


Since we made the Account name field mandatory in a previous step, you will not be able to submit the form until you've entered data in it.
pressing on the 'Finish' button without entering an account name will open a small pop up window where you will be required to enter a value.


* Please note that entering data in the PDF preview window is done by default via pop window. If you wish to have the filler make the changes inline you can turn on the 'Inline editing' checkbox when you configure your interactive mode.

- After entering data in your PDF preview fields - press on ‘Finish’ to submit the form and generate the PDF.


CommentsLogin Required
Didn’t find what you were looking for?
Try the following for assistance or Use the Search box.