GTM - 表单提交时的Fire标记（仅当填写了必填字段时）

Question

I'm looking for an easy way to accurately track form submissions. This is the code I'm currently using:

$(function () {
      $('#form').submit(function() {
        dataLayer.push({
            'event': 'GAEvent', 
            'eventCat': 'Form Submit - Create', 
            'eventAction': 'Form Submit Document', 
            'eventLabel': checked,
            'eventValue': count,
            'gaNonInt': false
        });
      });
    });

The issue is that the tag is firing even when the form is not submitting. For example, if someone fails to fill out a required field and clicks the submit button, GTM sees that submit click as a submission. Is there an easy way to only fire the tag if all required fields are filled?

Thanks in advance.

Answer 1

You might want to try to use GTMs "native" submit trigger instead of the jQuery code and make sure that the "check validation" checkbox is ticked.

The javascript validation in your form suppresses the default behavior of the submit button and calls the submit event only when the validation has passed. With the "check validation" option set the GTM form submit trigger should be able to notice that the default behavior is prevented and fire the tags only when the validator functions calls the submit event (I say "should" because, anecdotally, I think the form submit trigger is not always 100% reliable, but it might be worth a try).