Search code examples
javascriptonclickgoogle-ads-apiajaxform

Google AdWords Conversion Tracking on a form send


Good day, I'm trying to configure the AdWords conversion code for my website and I can't find any of the information I'm looking for in Google documentation. Ultimatly, I want to track a onClick event on the submit input of the form.

I want to know what should I include in my onClick event, since the send button doesn't lead to another page, but have an AJAX loading?

My AdWords tracking code is :

<script type="text/javascript">
   /* <![CDATA[ */
	   goog_snippet_vars = function() {
	     var w = window;
	     w.google_conversion_id = 12345678;
	     w.google_conversion_label = "abcDeFGHIJklmN0PQ";
	     w.google_remarketing_only = false;
	   }
	   // DO NOT CHANGE THE CODE BELOW.
	   goog_report_conversion = function(url) {
	     goog_snippet_vars();
	     window.google_conversion_format = "3";
	     window.google_is_call = true;
	     var opt = new Object();
	     opt.onload_callback = function() {
	     if (typeof(url) != 'undefined') {
	       window.location = url;
	     }
	   }
	   var conv_handler = window['google_trackConversion'];
	   if (typeof(conv_handler) == 'function') {
	     conv_handler(opt);
	   }
	}
   /* ]]> */
</script>
<script type="text/javascript"
    src="//www.googleadservices.com/pagead/conversion_async.js">
</script>


Solution

  • Ultimately, I was looking for the conversion to be saved only if the form is sucessfully sent (After Javascript validation). I could not use the onClick on the button, because it would save the conversion even if the form has not submited due to an invalid value in a field.

    The easiest way to do so, was to add this in jQuery :

    $('#contactform').submit(function(e){
        if( $( this ).valid() ) {
            goog_report_conversion ('http://example.com/your-link') // Change for your page link.
            alert("Conversion!"); // Confirmation that the conversion has been sent. Remove after testing. 
        }
    });