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


#1

Hi,

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

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:

unnamed

Thanks


#3

Hi @alexungarp, would you be able to link the page where you're seeing this issue? Happy to take a look for you here. Looking through your forms here: https://app.hubspot.com/forms/2394439?dateType=LAST_THIRTY_DAYS&formType=ALL&offset=0&parentId=0&query=&sortDirection=DESCENDING&sortingColumn=LAST_MODIFIED I can't see one that starts with 2c as per your screenshot.


#4

yes, http://escueladeadministracion.reactorlabs.net/mba/versiones/mba-ingenieros-comerciales-y-civiles-industriales/

thanks


#5

Hi @alexungarp, I think this is happening because you're currently embedding your form with the default styles included. You should go here: https://app.hubspot.com/forms/5068023/editor/bb7a0bf0-f556-457d-af57-97c50a987633/edit/options, and toggle the unstyled form button. If you do what you're currently doing, your form loads in an iFrame, and you won't be able to manipulate data inside it. If you turn on the unstyled form option, you'll be able to embed your form and have access to any of the methods described here: https://developers.hubspot.com/docs/methods/forms/advanced_form_options


#6

Conor, we still have not solved this problem.
What is happening we would love to know if you can but what I see on the platform, not make a form like the 'Pop-up forms' but adapt it with a code to where we want.

Thing that the form appears once by clicking on the tab but as with the functionality of the form of a 'Pop-up forms'

for what they tell me, the result of the form does not charge to be inside a hidden div.

Thanks


#7

Hi Conor, a couple of days ago I sent you a message.
you saw it?

Thanks


#8

Hi @alexungarp, apologies, I missed your last reply.

I'm sorry but I still do not understand what your issue is. The console warning is gone now when I load this page: http://escueladeadministracion.reactorlabs.net/mba/versiones/mba-ingenieros-comerciales-y-civiles-industriales/

Where is the pop up form you're talking about? What is your end goal?


#9

My problem is that I can not insert a hubspot form in https://escueladeadministracion.uc.cl/mba/versiones/mba-ingenieros-comerciales-y-civiles-industriales/. Specifically insert the form once by clicking on the attached button.


#10

Thank you for clarifying @alexungarp! Very helpful :slight_smile:

You should be able to simply grab your embed code, and place the HTML within your pop up modal where you non-HubSpot form currently lives. To get your embed code you can use this Knowledge Article: https://knowledge.hubspot.com/articles/kcs_article/forms/how-can-i-share-a-hubspot-form-if-im-using-an-external-site

Once you have the code and you make sure you're using an Unstyled Form, so that it does not render in an iFrame, we can then alter the embed code a bit. To ensure the form loads in the correct location, we can use the target attribute. In your case you'd want to use #cboxLoadedContent as your target. So your embed code would look something like this:

<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
  hbspt.forms.create({
	portalId: "HubID here",
	formId: "form id here",
	css: "",
    target: "#cboxLoadedContent"
});
</script>

Hope this helps!