Custom Form Embed Not Capturing Data From IOS Devices

[andrewzistler]

Hello, and thank you for reading!

I'd love to have a fix - but I'd also settle for knowing if this is an issue with our implementation vs an issue caused by IOS 16.2. It seems the issue began just after the update came out - but the forms below were updated around the same day.

Update: I found an answer here, to a similar question. Changing the "onFormSubmit" function to "onFormSubmitted" properly sends the form data. 

However, after that change, the javascript snippet that sends users to another page no longer works. 

Any thoughts?

----------------------------------------------------------------------------------------------

Primary Question:

A client has a piece of custom javascript that qualifies leads instantly by reading HS Form answers.

If their revenue is under $X, they're redirected to another page, over $X, and they're sent to a meeting booking page. (See code below)

After a recent update to the form, it seems as though IOS devices are somehow preventing data from being captured by the form. 

It took me forever to replicate the error, since the form works on all non-IOS devices. The qualifying script works fine on IOS too - but no data is sent back to HubSpot after a form fill for IOS devices only.

Any ideas for a fix? Any help would be greatly appreciated! I don't normally code.

----------------------------------------------------------------------------------------------

Secondary Question: In the form embed script below, there is a "version" parameter. I can't seem to find "version" listed in any forms API documentation... is that parameter nessecary, or just internal?  

----------------------------------------------------------------------------------------------
Custom Form Embed:

Spoiler

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
region: "na1",
portalId: "(Portal ID Removed for Client Privacy)",
formId: "(Form ID Removed for Client Privacy)",
version: "V2_PRERELEASE",
onFormSubmit: function($form) {

var monthlyRevenue = $form.find('input[name="previous_year_revenue"]:checked').val();

if (monthlyRevenue == 'Less Than $500K') {
window.location.href = '(URL Removed for Client Privacy)';
}
else {
window.location.href = '(URL Removed for Client Privacy)';
}

}
});
</script>

[TiphaineCuisset]

Hi @andrewzistler 

Thank you for reaching out.

I want to tag some of our experts here - @Anton @LMeert do you know what may be happening here? 

Thank you!

Best

Tiphaine

[LMeert · Accepted solution]

Hi @TiphaineCuisset, @andrewzistler,

It's completely normal that your redirection script stopped working after you changed the trigger to 'onFormSubmitted'.

Here's the result of a console.log of the data sent by postMessage from the form iframe on both events : onFormSubmit and onFormSubmitted :

As you can see the payload is different and the 'onFormSubmitted' one doesn't include the form data, which means you'll have to change the redirection script.

You could imagine changing the onFormSubmit script to to a redirect url in a cookie or in the local storage of the browser (or even add a url parameter) and then add a redirect on the onFormSubmitted event and get the aforementionned url from the cookies.

Hope this helps !
If it does, please consider marking this answer as a solution 🙂

Best,

Ludwig