marketo.success event is no longer pushing into GTM

[debbie_917]

Hello
The marketo.success event is no longer pushing into GTM, specifically those created in knak. This is a NEW issue. They did work before.

Page created in Knak and synced into Marketo (Not pushing into GTM)
https://www5.cadence.com/upgrade-with-allegro.html

Page created in Marketo (Pushing into GTM)
https://www5.cadence.com/newsletter-subscription-msa-ebook-rfmw-lp.html

Thanks

[SanfordWhiteman]

First: it’s not actually true that the first URL doesn’t load the GTM tag that in turn binds DataLayer events to the Marketo form onSuccess and other events.

Rather, you have a race condition, so it sometimes loads the tag, sometimes doesn’t. So please show in depth the trigger(s) you have set up in GTM to load that tag. (This is impossible to decipher from outside, one needs to log into or at least get screenshots of your GTM console.)

Second: the JS code in the tag itself is wrong as it doesn’t wait properly for the Marketo Forms 2.0 library (i.e. MktoForms2 global object) to load. The correct way is to listen for the capture phase load event. However, the principal problem is the race condition noted above.

[debbie_917]

@SanfordWhiteman I will take a look into it.

It appears it is the Marketo Listener that is NOT firing on that page.

<script>
/**
 * push events to Google Tag Manager when the Marketo Forms 2 Javascript is
 * loaded and executed and when Marketo form events occur
 * uses the Marketo Forms 2.0 API
 * http://developers.marketo.com/documentation/websites/forms-2-0/
 *
 * @author Keith W. Shaw <keith.w.shaw@gmail.com>
 * @license MIT
 */
(function marketoFormListener () {

    "use strict";

    /**
     * poll for global MktoForms2 variable to be defined
     * @returns {undefined}
     */
    function pollForMktoForms2 (delay) {

        if (isNaN(delay)) {
            throw new Error("Expected delay (" + delay + ") to be a number.");
        }

        if (window.MktoForms2) {

            // mark the start of the script loading
            window.dataLayer = window.dataLayer || [];
            window.dataLayer.push({
                "event": "mkto.form.js",
                "mkto.form.start": (new Date()).getTime()
            });

            // bind liseners for all Marketo Form events
            addMktoForms2Listeners(window.MktoForms2);

        } else {

            // keep polling, but progressively increase the delay
            setTimeout(pollForMktoForms2.bind(null, 2 * delay), delay);

        }

    }

    /**
     * helper function to push invalid Marketo field errors to GTM
     * @returns {undefined}
     */
    function waitForError () {

        var element, input, mktoErrorMsg;

        // check for error message
        element = document.querySelector(".mktoErrorMsg");
        if (element) {

            mktoErrorMsg = element.textContent || element.innerText;

            // look for invalid input
            input = document.querySelector("input.mktoInvalid, .mktoInvalid input");
            window.dataLayer.push({
                "event": "marketo.form.error",
                "mkto.form.error.message": mktoErrorMsg,
                "gtm.element": input,
                "gtm.elementClasses": input && input.className || "",
                "gtm.elementId": input && input.id || "",
                "gtm.elementName": input && input.name || "",
                "gtm.elementTarget": input && input.target || ""
            });

        }

    }

    /**
     * setup Marketo Form listeners to push events to GTM
     * @returns {undefined}
     */
    function addMktoForms2Listeners (MktoForms2) {

        MktoForms2.whenReady(function handleReady (form) {

            window.dataLayer.push({
                "event": "marketo.form.ready",
                "mkto.form.id": form.getId(),
                "mkto.form.submittable": form.submittable(),
                "mkto.form.allFieldsFilled": form.allFieldsFilled(),
                "mkto.form.values": form.getValues()
            });
            form.onValidate(function handleValidate (valid) {

                window.dataLayer.push({
                    "event": "mkto.form.validate",
                    "mkto.form.valid": valid
                });

                // wait for the error message to appear
                setTimeout(waitForError, 0);

            });
            form.onSubmit(function handleSubmit (thisForm) {

                var button;

                button = thisForm.getFormElem().find("button[type=\"submit\"]");

                window.dataLayer.push({
                    "event": "marketo.submit",
                    "mkto.form.id": thisForm.getId(),
                    "mkto.form.submittable": thisForm.submittable(),
                    "mkto.form.allFieldsFilled": thisForm.allFieldsFilled(),
                    "mkto.form.values": thisForm.getValues(),
                    "mkto.form.button": {
                        "classes": button.attr("class"),
                        "text": button.text(),
                        "type": "submit"
                    }
                });

            });
            form.onSuccess(function handleSuccess (values, followUpUrl) {

                window.dataLayer.push({
                    "event": "marketo.success",
                    "mkto.form.values": values,
                    "mkto.form.followUpUrl": followUpUrl
                });

            });

        });

        MktoForms2.whenRendered(function handleRendered (form) {

            window.dataLayer.push({
                "event": "marketo.form.rendered",
                "mkto.form.id": form.getId(),
                "mkto.form.submittable": form.submittable(),
                "mkto.form.allFieldsFilled": form.allFieldsFilled(),
                "mkto.form.values": form.getValues()
            });

        });

    }

    // start polling with an initial delay of 125ms
    pollForMktoForms2(125);

}());
</script>

[SanfordWhiteman · Accepted solution]

As noted above, you’re not correctly waiting for the MktoForms2 global object. Until you fix that, it’s not worth troubleshooting since the code is going to change.