JotForm is a really powerful tool for making forms with lots of cool features. But if you want to track JotForm submissions with Google Tag Manager and Google Analytics, it can be a bit confusing. There are many ways JotForm can be included in your website for example using an embedded iframe, direct HTML code, or just by linking to the form page with a button.
In the following tutorial, I explained how to track different types of JotForm submissions. As well as I have also shared the way to collect form input values.
JotForm GTM DataLayer Code
<script>
/**
* Author: Md Hasanuzzamna
* Linkedin: https://linkedin.com/in/md-h
* Youtube: https://youtube.com/@leomeasure
* Email: info@leomeasure.com
*/
// For iFrame Form
window.addEventListener('message', function (event) {
if(event.origin.includes('jotform.com') && event.data.action === 'submission-completed') {
window.dataLayer = window.dataLayer || [];
dataLayer.push({
event: 'jot_form_submit',
formId: event.data.formID
});
}
});
// For Srouce Code Form
(function() {
document.addEventListener('submit', function(event) {
var form = event.target.closest('form[action^="https://submit.jotform.com"]');
if(form) {
var formData = new FormData(form);
var formInputs = {};
formData.forEach(function(value, key) {
formInputs[key] = value;
});
delete formInputs['jsExecutionTracker'];
delete formInputs['validatedNewRequiredFieldIDs'];
delete formInputs['simple_spc'];
delete formInputs['submitSource'];
dataLayer.push({
event: 'jot_form_submit',
formId: formInputs.formID,
inputs: formInputs
});
}
});
})();
</script>
Hi LeoMeasure,
I have JotForm installed as iFrame and I use a thank you page. I cannot see the submission event. How can I get an submission when using the thank you page?
Many thx
OItto
You have to track thank you page view.
This was very helpful in tracking Form Submissions via the iFrame method. Is it possible to track Form Initiations in an iFrame?
Is it possible to track Form Initiations in an iFrame?
Yes, it is possible.
This was very helpful!! I got all the way to where I’m testing in Debug, and form-start is sending to GA4, but not submit. Do you have any ideas on how to get that sent over to GA4 to register successfully?
Please contact use with your form details.
Hi, is there a way to check iframe Jotform and collect form input data as well?
No way, you need to use self hosted Jotform to collect form inputs,
Hey! I seem to have the same issue as many others. Upon implementing your code into a custom html tag (in gtm) on my site that contains a Jotform form on the contact us page, I am not getting a “jot_form_submit” event on the submission of the form. The form is implemented via an iframe script. Can you please help me out? huge thanks!