Auto-Fill Custom Fields in Forms Using Custom HTML/JavaScript

You can automatically populate custom fields in your enrollment forms or surveys using custom HTML and JavaScript. The values you populate will be saved with the form submission.

Step 1: Find Your Custom Field ID

First, you need to identify the unique ID for the custom field you want to auto-populate:

1. Open your form in Preview mode
2. Right-click anywhere on the page and select Inspect
3. Click the element selector tool (mouse pointer icon) in the inspector
4. Click on the custom field you want to target
5. In the HTML code, copy the value from the name and id properties

Step 2: Use the Field ID in Your Code

Once you have the field ID, you can populate it with custom JavaScript. Here's the basic pattern:

document.getElementsByName('yourCustomFieldId')[0].value = yourData;
document.getElementsByName('yourCustomFieldId')[0].dispatchEvent(new Event("input"));

Example

If you created a custom field named xxTrustedFormCertUrl, your code might look like:

document.getElementsByName('xxTrustedFormCertUrl')[0].value = myData;
document.getElementsByName('xxTrustedFormCertUrl')[0].dispatchEvent(new Event("input"));

Pro Tip: In the example above, myData is a placeholder. In your actual code, replace it with your data source—whether that's a URL parameter, cookie value, or data from another script.

Important Notes

• The dispatchEvent line is required to trigger Enrollio's form validation and save the value properly
• Make sure your custom field exists in your form before trying to populate it
• Test your form thoroughly after adding custom code to ensure values are captured correctly

This technique is useful for tracking referral sources, capturing campaign data, or pre-filling information from URL parameters when families arrive at your enrollment forms.