Issue with Submitting marketo forms with events in GA | Community
Skip to main content
M
manishk56775265
Level 4
November 9, 2016
Question

Issue with Submitting marketo forms with events in GA

  • November 9, 2016
  • 1 reply
  • 4407 views

Hello There,

I have created a Marketo Form and inserted its embed code in the (External) Landing page

sites.tcs.com/marketo-form-test/

Also, I have added code for from validation - to restrict any personal email ids i.e. gmail, hotmail, etc. - This is working fine.

We also need a ga event (ga('send', 'event', 'Download', 'Click', 'GTS-2016-Download');) fired on Successful form fill; for this we have used the onSuccess handler, But the event is NOT firing; Attaching the code used in Title of the document below: Could Anyone guide what is that We are doing Wrongly to not fire the Event. We have implemented GA code via GTM in the head section of the page.

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

<form id="mktoForm_3683">

<div style="margin-left:275px; margin-bottom:10px;">

<script src="linkedin.com/autofill/js/autofill.js" type="text/javascript" async></script><script type="IN/Form2" data-form="mktoForm_3683" data-field-firstname="FirstName" data-field-lastname="LastName" data-field-phone="MobilePhone" data-field-email="Email" data-field-company="Company" data-field-title="Title"></script>

</div></form>

<br>

<link type="text/css" rel="stylesheet" href="form2.css" />

<script>MktoForms2.loadForm("//app-sji.marketo.com", "120-PTN-868", 3683, function (form){MktoForms2.lightbox(form).show();});</script>

<script>

(function (){

  var invalidDomains = ["@gmail.","@yahoo.","@hotmail.","@live.","@aol.","@outlook."];

  MktoForms2.whenReady(function (form){

  form.addHiddenFields({

    ReferringSite : document.referrer

  });

    form.onValidate(function(){

      var email = form.vals().Email;

      if(email){

        if(!isEmailGood(email)) {

          form.submitable(false);

          var emailElem = form.getFormElem().find("#Email");

          form.showErrorMessage("Please use your business email. Thank you!", emailElem);

        }else{

          form.submitable(true);

        }

      }

    });

  /* --------------------------------------------- */

  form.onSuccess(function (values, url){

  /////var url ="google.com" (google.com%27) ;

  //alert("VAL :"+values);

  //alert("URL :"+url);

                    // Send a "Event" to google analytics to trigger a premium content download for this piece of content

                    ga('send', 'event', 'Download', 'Click', 'GTS-2016-Study-Known-User');

                    // Opens the form's Follow Up URL on successful completion (the asset is specified in the Marketo form config)

                    ////window.open(url, 'myWindow');

                    ///form.getFormElem().hide();

                    // add the custom thank you message and download link to the actual asset

                   //// var thankYou = "";

                    ////form.getFormElem().before("<p style='padding:10px;width:283px;font-size:14px;color:white;height:100px;text-align:center'>Thank you for downloading.<br/><br/>Your content will open in a new window.</p>"); 

                    return true;

                });

    /* --------------------------------------------- */

  });

 

  function isEmailGood(email) {

    for(var i=0; i < invalidDomains.length; i++) {

      var domain = invalidDomains[i];

      if (email.indexOf(domain) != -1) {

        return false;

      }

    }

    return true;

  }

})();

</script>

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

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

E
ErikHe1
Level 5
November 9, 2016

Hi Manish,

You need to just create an Event in GA upon successful form fill?

I went through this a few weeks ago and used this script in the end of the body:

<script>

        MktoForms2.whenReady(function (form) {

     form.onSubmit(function(){

        ga('send', {

          hitType: 'event',

          eventCategory: 'Fills out Form',

          eventAction: 'Downloads Content',

          eventLabel: 'Guide'

        });

       });
   });

        </script>

Also given that the GA script is in the head.

SanfordWhiteman
SanfordWhiteman
Level 10
November 9, 2016

The problems with using onSubmit instead of onSuccess are two:

  1. Multiple onSuccess functions can run, and if any of those stop form submission you've erroneously logged a form submit when it never happened.
  2. You're just masking the race condition by making it less likely, but not eliminating it. There is no guarantee that ga() is going to finish before onSuccess runs and the page unloads.

The only way to reliably log a successful form submission to GA is to use hitCallback:

form.onSuccess(function(vals,tyURL){
     ga('send', {
          hitType: 'event',
          eventCategory: 'Fills out Form',
          eventAction: 'Downloads Content',
          eventLabel: 'Guide',
          hitCallback: function() {
            document.location.href = tyURL;
          }
    });
});
M
manishk56775265Author
Level 4
November 10, 2016

Thanks Stanford and Erik,

I placed the exact code (as in Standford's reply) but the Event Did Not fire. We are using GTM in Head to Fire the GA codes. Does this piece of code work with GTM?

Or Am I Doing Anything Wrong on sites.tcs.com/marketo-form-test/

Best,

Manish

Terms & ConditionsAccessibility statement

Loading footer...