How to Populate Custom Fields Using JavaScript in GoHighLevel Forms
Updated August 13, 2024
When standard form fields are not enough, GoHighLevel allows you to programmatically populate custom fields using custom HTML and JavaScript logic. By the end of this tutorial, you will know how to retrieve a custom field ID, inject dynamic data, and ensure the value is captured correctly on form submission.
Automatically populating a custom field in forms or surveys using custom HTML or JavaScript, and then saving it during submission, is a simple and straightforward process.
Retrieve the Custom Field ID:
– Go to the Preview of the form.
– Right-click on the page and select ‘Inspect.’
– Select the mouse pointer tool.
– Click on the “Custom Field.”
– Copy the ID from the name and ID properties.
Example:
If you created a custom field named `xxTrustedFormCertUrl`, follow the above steps to get its ID.
Note: myData is just for example. In the customer custom HTML/Javascript code. Customer have to figure it out where is the captured data and replace the myData
document.getElementsByName(‘customFieldId’)[0].value = myData; document.getElementsByName(‘customFieldId’)[0].dispatchEvent(new Event(“input”));