Couldn't find target container #hbspt-form-xxx

[Gilles_Poulles]

Hi,

I'm trying to add a value to a hidden field with the following script:

hbspt.forms.create({
	portalId: "xxx",
	formId: "yyy",
	target: "#test",
	onFormReady: function($form) {
		console.log("test");    
        $("input[name=\"what_kind_of_events_are_you_interested_in_\"]").val("test 123").trigger('change'); 
} 
});

The form is correctly rendered, and console.log works fine.
But the value is not added to the input field.
The console shows me the following error:

shell.js:12 Couldn't find target container #hbspt-form-xxxx for HubSpot Form yyyy. Not rendering form onto the page

thanks
Gilles

[Gilles_Poulles]

Thanks @Derek_Gervais,

I cleaned up the head section and implemented the jquery from a CDN to be sure that the core is not manipulated.
The error in the console disappeared but the form is still not changed on "onFormReady".
jQuery seems to work fine as I added an additional input field which I fill up via jQuery.

thanks
Gilles

[Tim_Joyce_Belch · Accepted solution]

@Gilles_Poulles - I'm not sure if this helps for your scenario but, if you are linking to the page from one of your events, you can pass the data you want to fill as a url parameter. The form will autopopulate based on the url parameter you set. So, you can test this by adding

/hb-test?where_would_you_like_to_sponsor_events_=hello!!!

to your URL and you will see the form field get prefilled. This is a feature that is often overlooked and not well documented.

Design beautiful HubSpot forms with https://forms.belch.io - tim@belch.io

[Gilles_Poulles]

Yes that solves my problem @Tim_Joyce_Belch
Thanks very much!

[Tim_Joyce_Belch]

Awesome! and, if you have trouble styling that form, head over to the form styler.

[Derek_Gervais]

Hi @Gilles_Poulles,

It seems like this is an issue with jQuery; it's behaving as if jQuery isn't being included, despite the fact that I can see it being loaded in the network tab. Is it possible you're only loading certain parts of the library, or otherwise customizing the jQuery library included on your page? This can happen because someone edited the core file, or a plugin may have overwritten the $ variable.

[Gilles_Poulles]

Hi @Derek_Gervais,

have a look: https://bit.ly/2v2eIwP

Thanks
Gilles

[Derek_Gervais]

Hi @Gilles_Poulles,

That's odd; I'm not entirely sure if that console error is related or not. Could you send me a link to the page you're seeing this issue with so that I can take a closer look?