JS Callbacks not... callingback

[sitefinitysteve]

Per the docs there should be callbacks on form submit

developers.hubspot.com

How to customize the form embed code

This is a list of options that you can use if you just need to tweak a default hubspot form. If you need complete control over the styles and actions of your form, you will still want to use the Forms API.

I have made a button that pops the form up in a bootstrap window, but the “onFormSubmit” doesn’t ever get called?

Sample:
https://cadence-inc.com/playground/hubspot
Open hubspotpopup.js

Any idea?
Thanks,
Steve

[IsaacTakushi]

@Jayesh_Prajapati,

Your question is not directly related to this thread. Please post a new topic.

[#3]

Hi Sir.

My client requires to call another API. to send the PDF of submitted form to entered EmailID. I am trying to fetch the data from the onsubmitform Method. but as per display in the blog of Global event data are not retrieved. can you please help on the same. I want to capture the entered data to call another API.

Please suggest.

[#4]

I’m using the new version of the forms but my callback isn’t firing. My submissions are going through.

I’m using this in the head.

<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script char-set="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>

I have multiple forms instantiated in the page in the form of this:

window.hbspt.forms.create({
      target: `.${dynamicClassName}`,
      css: '',
      portalId: 'my-portal-id',
      formInstanceId: `form-${dynamicInstanceId}`,
      formId,
      cssClass: dynamicClassName,
      submitButtonClass: 'button button-fill button-form',
      inlineMessage: 'Thanks! We will get in touch with you.',
      onFormSubmit() {
        // This is not triggering!
        console.log("HELLO??");
      },
   });

[#5]

I found out my problem:

The onFormSubmit function in hbspt.forms.create requires jQuery. It was not run.

But seriously, why do you need jQuery??

[#6]

How did you resove your problem?

[sitefinitysteve]

That is fantastic sir! …current != current

I will mark as complete for now, thx!

[3PETE]

Glad it is working. the current != current through me as well at first.

[sitefinitysteve]

Hey guys, my client is a customer of hubspot and is kinda of relying on us to deliver this functionality… can we work to a resolution please? I realize this is the only avenue for api support, but I really would like to get this resolved asap

[3PETE · Accepted solution]

@sitefinitysteve

You are using the old version of the form code, which I don’t think supported onFormSubmit. If you look at the source or the network tab, you are loading js.hsforms.net/forms/current.js, and that current.js is actually the older embed code. The actual current code you should use js.hsforms.net/forms/v2.js. The original current.js embed code didn’t have the onFormSubmit functionality (it did have onFormReady).

You’ll need to update to use the v2.js file.

You might also need to update the target you are using as well, seems like the old function can deal with using the actual jQuery object:
target: $("#" + id + " .popup .modal-body"),

but the new one may only accept the selector as a string:
target: “#” + id + " .popup .modal-body",

I was able to reproduce the issue on my end using the old current.js file.

[tjoyce]

I am having a similar issue across multiple wordpress sites that have a hubspot embedded form. The form settings are using “inline message” in the form builder but when you submit the form, the page refreshes back to itself. The fact that the console clears after submit, should help debug this issue since it’s supposed to be an inline message, not a redirect.

I have tested on 2 different websites using embedded HS forms

[sitefinitysteve]

Yeah, open your dev tools and inspect “hubspotpopup.js” you can see the callback specified, one of the events triggers, I think it’s formReady(?) but submit does not

[3PETE]

@sitefinitysteve When I ran the create block in the code I can see your first callback firing.

image.png976x272 30.3 KB

[sitefinitysteve]

Right I know, thats what I keep saying The one fires, but submit does not… submit is the only one I care about the other was just trying to test if I was going insane or not.

[3PETE]

@sitefinitysteve I’m stumped at the moment on this as well. I fully understand your problem as I can reproduce it now on your site. Let me run this by a couple of my co-workers tomorrow and hopefully we can figure this out.

[sitefinitysteve]

Been a few days, any clue yet?

[3PETE]

@sitefinitysteve No I don’t I pulled my manager in @zwolfson to lend a hand and we are having trouble pinpointing why this callback doesn’t run on your site. Something seems to be closing the form down after the network request but before the callback can fire. Are you preventing certain events firing some where on your page as a global thing?

[sitefinitysteve]

Absolutely nothing, pretty bare site, just loading jQuery and Bootstrap really. Like I mentioned above though, it’s a cross domain postback, could that be why? Browser restricting callback for security or anything maybe, server somehow need to whitelist (grabbing at straws)

[3PETE]

@sitefinitysteve Is this still an issue?
We had a momentary issue with our forms.

https://status.hubspot.com/incidents/j1b2htxlvtlz

[sitefinitysteve]

Yeah, give it a try, the “onFormSubmit” event just never trips

Does something need to happen on the server to allow a post return from your domain or something? …I can see it all working in the console, and I can see the form DATA in hubspot… but the js event never returns.

[3PETE]

The on form submit should fire after the button is clicked to submit and not after a response from our server. If you simply put a console.log(“in the callback”) in the function does it fire? Do you get any errors?

ex.

onFormSubmit: function($form) {
        console.log("call back fired")
        }