Custom Information in OOB forms

Marketing & Content Hub Lead Capture Tools
1

Hi everyone,

I’m currently working on customizing a HubSpot form (OOB — out-of-the-box) and would like to display some additional information either on, or before the Submit button.

Additionally, I’d like to know if it’s possible to control or customize the Submit button’s functionality — for example, running custom validation, triggering scripts, or modifying its behavior before the form actually submits.

Has anyone implemented something similar or can share the best approach to achieve this within HubSpot’s form framework (either through the embed code, custom HTML/JS, or HubSpot’s form APIs)?

2

Hi @hafizusama,

I believe this is the documentation you’re looking for :slightly_smiling_face: Legacy forms - HubSpot docs

Best regards!

3

Hi @karstenkoehler,

Thank you so much for sharing the reference documentation.

I’ve been working on this for the past few days and my goal is to style a specific field/property within a HubSpot form — specifically, I’d like to display a dropdown field as selectable “pills.”

Here’s the code I’m currently using:

<script
 charset="utf-8"
 type="text/javascript"
 src="//js.hsforms.net/forms/embed/v2.js"
></script>
<script>
 hbspt.forms.create({
 portalId: '',
 formId: '',
 onFormReady: function ($form) {
 // Custom script here
 console.log('Yes from form.');
 },
 });
</script>

``

Steps I’ve followed:

  1. Created a multi-step form.
  2. Created a custom module.
  3. Embedded the form within the custom module using the above code.
  4. Noticed that the onFormReady callback doesn’t seem to fire — the console log isn’t appearing.

My challenge is that I can apply CSS to the dropdown using class selectors, but this also affects other dropdowns globally, which I want to avoid.

After reviewing the documentation, I attempted to use the onFormReady callback to isolate and style the specific field, but it doesn’t seem to be executing. Additionally, in the module’s JS file, element selection by ID is returning an empty result.

Is there a recommended way to address this issue or a more reliable method to target and style a specific form field within a custom module?

Your guidance would be greatly appreciated.

Thank you in advance,