How do you get values from iFrame form?

charper_floqast — Tue, 27 Jul 2021 20:13:30 GMT

Hi, I can't get values from my iframe form. I need to take extracted values and pass it to a third party api.

This is how I'm trying it:

<!--[if lte IE 8]>

<![endif]-->

var firstName;

var lastName;

var businessEmail;

var phoneNumber;

var companyName;

var jobTitle;

var evalTime;

hbspt.forms.create({

region: "na1",

portalId: "7800846",

formId: "930a9a49-e26a-4e89-b379-4a628a2d78d3",

onFormSubmit: function($form) {

firstName = jQuery('input[name=firstname]').val();

lastName = jQuery('input[name=lastname]').val();

businessEmail = jQuery('input[name=email]').val();

phoneNumber = jQuery('input[name=number]').val();

companyName = jQuery('input[name=company]').val();

jobTitle = jQuery('input[name=jobtitle]').val();

evalTime = jQuery('select[name=evaluation_timeline]').val();

// console.log(firstName, lastName, businessEmail, phoneNumber, companyName, jobTitle, evalTime)

alert(firstName, lastName, businessEmail, phoneNumber, companyName, jobTitle, evalTime)

}

});

</script>

Based on this answers this is how it seems you do it:

https://community.hubspot.com/t5/CMS-Development/Getting-field-value-on-form-submit/td-p/326508

But my code doesn't work. I have confirmed my names are correct.

How do you get hubspot iframe form values.

Re: How do you get values from iFrame form?

JBeatty — Tue, 27 Jul 2021 21:43:23 GMT

Hi @charper_floqast,

Since you are working within the onFormSubmit try using the $form instead of your jquery object.

//Change this firstName = jQuery('input[name=firstname]').val(); //To this firstName = $form.find('input[name=firstname]').val();

I believe the issue is that by just using the "jQuery" object you are working within the object, and not within the form's iframe. Switching to use the $form object should place you in the correct scope.

Or if you wish to avoid using jQuery entirely you can use:

document.getElementById('hs-form-iframe-0').contentWindow.document.querySelectorAll('[name="firstname"]')[0].value

Just ensure that this form is the first and only form on your page, hence the "hs-form-iframe-0" id.

topic Re: How do you get values from iFrame form? in APIs & Integrations

How do you get values from iFrame form?

Re: How do you get values from iFrame form?