topic Re: Listening to a form submission event in an Iframe in APIs & Integrations

Listening to a form submission event in an Iframe

SZadik — Mon, 03 Apr 2023 11:21:35 GMT

Hello 🙂

We have an Hubspot form embed on our webflow website in an iframe. The form is inside a popup.

We want to run a JQuery/ JS function that listens to the HubSpot form submission and hides the popup modal (the form container) once submitted.
since the form is in an iframe we need to be able to listen to events inside the iframe.

Is this possible? any tips/code will be super helpful!

Thank you!

Re: Listening to a form submission event in an Iframe

Jaycee_Lewis — Tue, 04 Apr 2023 18:47:43 GMT

Hi, @SZadik 👋 Thanks for reaching out. Let's invite some community members into the conversation — hey @MatthiasWeber @tjoyce @Teun, have you helped any of your clients with similar projects? Do you have any suggestions on how they can tackle this? Or, if not, do you have any suggestions on other ways you've solved similar challenges?

Best,

Jaycee

Re: Listening to a form submission event in an Iframe

Teun — Tue, 04 Apr 2023 18:53:22 GMT

Hi @SZadik ,

Any chance you have a link that we can use? I want to see what events are pushed to the page on form load / submit.

Re: Listening to a form submission event in an Iframe

MatthiasWeber — Tue, 04 Apr 2023 18:54:56 GMT

I'm afraid @SZadik and @Jaycee_Lewis i don't have a solution. Communications between iframe and parent is a pain in the xxx: https://stackoverflow.com/questions/9153445/how-to-communicate-between-iframe-and-the-parent-site.

me "bad idea" would be to have a timer activated while the popup is active. Every 5 secods the timer is analyzing the content of the iframe: https://stackoverflow.com/questions/926916/how-to-get-the-bodys-content-of-an-iframe-in-javascript - if there somewhere a "conformation-information" you can close the popup.

I know this is a really bad-idea. Maybe some real js-expert has a fancy and nice solution. In the meanwhile: try to use my bad magic. I hope it helps ...

Re: Listening to a form submission event in an Iframe

SZadik — Mon, 10 Apr 2023 09:54:08 GMT

Hi @Teun , Thanks for your reply! We had some bug on the website but now I can share the link -

https://aggua-site.webflow.io/ebooks/data-catalog-buy-or-build-open-source-or-closed-source

We aim to close the popup once the form is submitted. Do you think we can listen to the submission event inside the iframe?

Thank you!

Re: Listening to a form submission event in an Iframe

SZadik — Mon, 10 Apr 2023 09:55:40 GMT

Thanks @MatthiasWeber , I'm not a JS expert but i'll look into the links you've sent.

Re: Listening to a form submission event in an Iframe

SZadik — Wed, 12 Apr 2023 11:32:59 GMT

Hi @Teun @MatthiasWeber

I've found a solution using the onFormSubmit callback function. it will be called when the form is submitted-

Re: Listening to a form submission event in an Iframe

Jaycee_Lewis — Wed, 12 Apr 2023 18:02:40 GMT

Hey, @SZadik! Thank you very much for taking the time to post your solution 🙌 We appreciate you! — Jaycee