Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HubSpot forms not loading with v2.3.1 #90

Closed
taksu opened this issue Dec 2, 2021 · 4 comments
Closed

HubSpot forms not loading with v2.3.1 #90

taksu opened this issue Dec 2, 2021 · 4 comments

Comments

@taksu
Copy link

taksu commented Dec 2, 2021

Hi,
I need to show HubSpot form inside a Tobii lighbox.
The form rendered correctly with the release v2.2.0.

The form type in HubSpot is "raw HTML form" and is rendered inline via JavaScript, so it's not an iframe embed.

// code to create the HubSpot form

hbspt.forms.create({
        portalId: 'xxx',
        formId: 'xxx',
      });

v.2.3.0 does not render the form either.
Can you please check what could have broke this with these releases.
Thanks.

@viliusle
Copy link
Collaborator

viliusle commented Dec 2, 2021

Looks like paid software, so it is very difficult to help you. Real working example from your side could help. Also check console for errors.

@taksu
Copy link
Author

taksu commented Dec 3, 2021

Could also be done with a free account and he're examples:

..links removed..

@viliusle
Copy link
Collaborator

viliusle commented Dec 3, 2021

HTML:

<a href="#hidden-hubspot-form" data-type="html" class="lightbox" data-group="hbs">
  Open HubSpot form
</a>
<div style="display:none;">
	<div id="hidden-hubspot-form">
    	<h1>HubSpot form should be displayed here</h1>
        <div id="form_placeholder"></div>
	</div>
</div>
<script charset="utf-8" type="text/javascript" src="https://js.hsforms.net/forms/shell.js"></script>

<script>

  //init Tobii here

  //form
  var form_activated = false;
  tobii.on('open', function (e) {
    if(e.detail.group === 'hbs' && form_activated == false){
      //init form
     hbspt.forms.create({
        region: "na1",
        portalId: "6654994",
        formId: "1a321d67-f2a3-4e1b-afc8-11d52496762d",
        target: ".tobii__slider #form_placeholder",
      });
      form_activated = true;
    }
  })
</script>

When use open dialog, HTML content is copied from hidden element to visible area. So this show form when dialog is opened and we ask to show it inside modal.

@taksu
Copy link
Author

taksu commented Dec 9, 2021

That will do the job. Thank you.

@taksu taksu closed this as completed Dec 9, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants