APIs & Integrations

Not applicable

Couldn't find target container #hbspt-form-XXXX for HubSpot Form XXXX. Not rendering form onto the page

SOLVE

Seems like this has been a topic before, but not finding a solution that works - same exact issue as Couldn't find target container #hbspt-form-xxx, form is created and I can see it being rendered on the page, but the console is telling me that it's NOT rendered and thus submissions don't work at all.

Live page with form: https://zogculture.com/why-play/

Code used to embed:

	<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/shell.js"></script>
	<script charset="utf-8" type="text/javascript" src="//js.hubspot.com/forms/current.js"></script>
	<script>
		hbspt.forms.create({
			portalId: '3266474',
			formId: '9840b39a-4fb7-45c2-a685-2a9208289f26',
			css: '',
			target: '#hubspot-form--<?php echo $random; ?>',
			formInstanceId: '<?php echo $random; ?>',
			onFormReady: function( $form ) {
				$form.attr( 'target', 'hubspot-iframe');
			}
		});
	</script>

	<div id="hubspot-form--<?php echo $random; ?>"></div>

	<iframe name="hubspot-iframe" id="hubspot-iframe"></iframe>

($random is just a PHP variable to generate a random number between 1 and 1000000)

Anyone find a fix for this that works successfully (or have an idea that might be worth a shot)?

0 Upvotes
1 Accepted solution
cbarley
Solution
HubSpot Alumni
HubSpot Alumni

Couldn't find target container #hbspt-form-XXXX for HubSpot Form XXXX. Not rendering form onto the page

SOLVE

Hi @kyle_conrad, a few things here. I can see that you're using the shell.js file in conjunction with current.js? If so, when I go to your portal to grab the embed code, I'm only seeing that we should be including shell.js. The second thing which is likely the biggest is that your portal is currently on Marketing Starter. Marketing Starter portals do not have access to editing the embed code as per the yellow notice at the top here: https://developers.hubspot.com/docs/methods/forms/advanced_form_options

When I use your embed code on a live page of mine here, and hardcode the values your php script is running, my form renders. Your HubSpot form appears to be hidden by CSS:

Let me know if you have questions

View solution in original post

0 Upvotes
2 Replies 2
cbarley
Solution
HubSpot Alumni
HubSpot Alumni

Couldn't find target container #hbspt-form-XXXX for HubSpot Form XXXX. Not rendering form onto the page

SOLVE

Hi @kyle_conrad, a few things here. I can see that you're using the shell.js file in conjunction with current.js? If so, when I go to your portal to grab the embed code, I'm only seeing that we should be including shell.js. The second thing which is likely the biggest is that your portal is currently on Marketing Starter. Marketing Starter portals do not have access to editing the embed code as per the yellow notice at the top here: https://developers.hubspot.com/docs/methods/forms/advanced_form_options

When I use your embed code on a live page of mine here, and hardcode the values your php script is running, my form renders. Your HubSpot form appears to be hidden by CSS:

Let me know if you have questions

0 Upvotes
Not applicable

Couldn't find target container #hbspt-form-XXXX for HubSpot Form XXXX. Not rendering form onto the page

SOLVE

Ah, thanks so much for the help! Totally didn't realize that the client was on Starter and that they didn't have the ability to edit the embed code - will circle back with them on that front. Really appreciate it.