I am trying to create an event in Google Analytics based on a form submit using tag manager.
I initially tried to setup a form submit listener, but since there is JS validation that happens, and the form is submitted through JS, I have moved on to try the click listener. (Basically trying to solve this problem without getting a dev team involved FOR NOW. I was told that's why the tag wasn't firing, b/c the form submit event is executed by JS. Eventually I will have to, b/c I don't want to track events before validation happens).
So I have a click listener on my form submit button and it fires the event just fine. However, I am trying to use a custom JS macro to read the selected values of two form field boxes in this form.
But for testing purposes before I try to read these specific values, I am just trying to read ANY data from the form. This is my macro that is firing. I have defined {{firstName}} and {{lastName}} as macros as well. They are HTML input fields, with unique id's. They are macro's defined as DOM Elements, with their respective id's: first-name and last-name.
function() {
var firstName = {{firstName}}.value;
var lastName = {{lastName}}.value;
var myForm = {{Ajax Contact Form}};
console.log({{Ajax Contact Form}});
console.log("Element Classes: " + myclass);
console.log({{firstName}});
console.log({{lastName}});
return firstName + '-' + lastName;
}
But it's not capturing any data. I am not clearing the form fields until 3 seconds after the form submits, and this data is already written. I have attached a screenshot of what is printing to the console.
Again, I am not using the form submit listener here, I am using the click event listener, and I am just trying to read some values from some form elements when the button is clicked.
Link to image
http://i.imgur.com/ktE3Kge.png
UPDATE
I am starting to think I need a custom HTML tag. So when my click rule is fired, it finds the form values I need, create a virual URL and push it to the dataLayer via this new custom HTML tag. Then what? Create another Google Analytics tag with a track type of 'event' or something? Or am I way off course here?