Learn how to create a polished template by enabling an auto-replace feature. In the example below, an Ownership drop-down menu (Select component) automatically replaces the default Applicant 1 and Applicant 2 labels with the clients' first and last names.
Contents
Prerequisites
Know how to create a fact find template.
Know how to use components.
Creating template fields
The first step is to locate (or create) the first and last name fields that will feed into the dynamic drop-down menu. In the screenshot below, the template has two name fields (first and last) for two applicants. We created the name fields with four Text Field components. We created a bank account Ownership drop-down menu using a Select component.
The Ownership drop-down has three data source values: Joint, Applicant 1, and Applicant 2.
Copying property names
Next, find and copy the API Property Name for each first and last name field.
To complete this task, it's a good idea to open Notepad (or a similar app). You'll need to copy and paste several names.
Select one Text Field component (e.g. Applicant 1's first name).
Click the Edit icon.
Select the API tab.
Copy the value in the Property Name field.
Paste that value into a Notepad file.
Repeat the steps for the other name fields.
Creating a dynamic menu
Insert a bit of code to enable a dynamic drop-down menu.
Go to the Select component with the drop-down menu (e.g. Ownership field).
Click the Edit icon.
Select the Data tab.
Scroll down to the Item Template field.
Copy the below code and paste it between the span tags.
Replace placeholder values in the default code with your values. (see below)
Click Save and then Save again on the template page.
{{
(
item.value === 'applicant1'
? `${data.firstName} ${data.lastName}`
: item.value === 'applicant2'
? `${data.firstName1} ${data.lastName1}`
:''
).trim()||item.label
}}
Previewing the results
Go to the template page and click the Preview button.
Go to the page with first and last names.
Enter the name of each applicant.
Click the Ownership field.
Select a name or Joint.
The template displays the names instead of the generic Applicant 1 and Applicant 2 text.
If your template has multiple ownership fields (e.g. for Bank 2, Bank 3, etc.), copy the code and paste it into each Select component.
