APIs & Integrations

Not applicable

Error on submit when utilizing onFormReady

I tried asking about this in another thread, but I didn’t get an answer so I’m hoping for some more visibility.

My current integration looks like this.

hbspt.forms.create({
    portalId: '[Proper portalId]',
    formId: '[Proper formId]',
    onFormReady($form, ctx){
        script.parentNode.appendChild($form[0]);
    }
});

The onFormReady portion is just for placing the form in the correct place on the page. Otherwise, the form will appear on the bottom of my page, which is not desirable.

This displays the form perfectly. However, when I try to submit the form, I get the following error.

Uncaught Error: Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.
at r (http://js.hubspot.com/forms/v2.js?_=1486060461543:4:21125)
at Object.findComponentRoot (http://js.hubspot.com/forms/v2.js?_=1486060461543:3:15072)
at Object.findReactNodeByID (http://js.hubspot.com/forms/v2.js?_=1486060461543:3:14535)
at Object.l [as getNode] (http://js.hubspot.com/forms/v2.js?_=1486060461543:3:12017)
at Object.s [as executeDispatch] (http://js.hubspot.com/forms/v2.js?_=1486060461543:1:21975)
at executeDispatch (http://js.hubspot.com/forms/v2.js?_=1486060461543:4:5886)
at a (http://js.hubspot.com/forms/v2.js?_=1486060461543:1:21924)
at Object.l [as executeDispatchesInOrder] (http://js.hubspot.com/forms/v2.js?_=1486060461543:1:22045)
at c (http://js.hubspot.com/forms/v2.js?_=1486060461543:1:18915)
at Array.forEach (native)

This, unfortunately, is not telling me very much. Any idea what might be causing this error, or at least what could help me debug it further?

Interestingly, if I remove the onFormReady part and submit the form at the default position, the form submits without error, as expected.

0 Upvotes
1 Reply 1
Dadams
HubSpot Employee
HubSpot Employee

Error on submit when utilizing onFormReady

Hi @thalandor46

You can use the target attribute of the embed code for this. The target attribute takes a jQuery-style selector, and the form will automatically be inserted into the specified element after being built.

0 Upvotes