Thursday, May 9, 2024
 Popular · Latest · Hot · Upcoming
150
rated 0 times [  151] [ 1]  / answers: 1 / hits: 67171  / 14 Years ago, tue, february 22, 2011, 12:00:00

I'm pretty new to javascript, and therein probably lies my problem. I'm trying to track AdWords conversions that occur within a widget on our site. The user fills in a form and the result from the widget is published in the same div without a page refresh. The issue I'm having is when I try to appendChild (or append in jQuery) both script elements in Google's code (shown below) the page gets 302 redirected to a blank Google page (or at least that's what it looks like through FireBug).
I'm able to provide a callback method for the results of the form, and that's where I'm trying to insert the AdWords tracking code. For reference, this is the code provided by Google:



<script type=text/javascript>
/* <![CDATA[ */
var google_conversion_id = 993834405;
var google_conversion_language = en;
var google_conversion_format = 3;
var google_conversion_color = ffffff;
var google_conversion_label = bSpUCOP9iAIQpevy2QM;
/* ]]> */
</script>
<script type=text/javascript src=http://www.googleadservices.com/pagead/conversion.js>
</script>
<noscript>
<div style=display:inline;>
<img height=1 width=1 style=border-style:none; alt= src=http://www.googleadservices.com/pagead/conversion/993834405/?label=bSpUCOP9iAIQpevy2QM&amp;guid=ON&amp;script=0/>
</div>
</noscript>


Pretty standard stuff. So, what I'm trying to do is insert this into the results page using the callback method (which is provided). Frankly, I'm redirected no matter when I try to insert this code using js or jQuery (either on original page load or in the callback) so maybe the callback bit is irrelevant, but it's why I'm not just pasting it into the page's code.



I've tried a number of different ways to do this, but here's what I currently have (excuse the sloppiness. Just trying to hack my way through this at the moment!):



function matchResultsCallback(data){

var scriptTag = document.createElement('script');
scriptTag.type = text/javascript;
scriptTag.text = scriptTag.text + /* <![CDATA[ */n;
scriptTag.text = scriptTag.text + var google_conversion_id = 993834405;n;
scriptTag.text = scriptTag.text + var google_conversion_language = en\;n;
scriptTag.text = scriptTag.text + var google_conversion_format = 3\;n;
scriptTag.text = scriptTag.text + var google_conversion_color = ffffff\;n;
scriptTag.text = scriptTag.text + var google_conversion_label = bSpUCOP9iAIQpevy2QM\;n;
scriptTag.text = scriptTag.text + /* ]]> */n;
$('body').append(scriptTag);

$('body').append(<script type=text/javascript src=http://www.googleadservices.com/pagead/conversion.js />);
//I have also tried this bit above using the same method as 'scriptTag' with no luck, this is just the most recent iteration.

var scriptTag2 = document.createElement('noscript');
var imgTag = document.createElement('img');
imgTag.height = 1;
imgTag.width = 1;
imgTag.border = 0;
imgTag.src = http://www.googleadservices.com/pagead/conversion/993834405/?label=bSpUCOP9iAIQpevy2QM&amp;guid=ON&amp;script=0;

$('body').append(scriptTag2);
$('noscript').append(imgTag);
}


The really odd thing is that when I only insert one of the script tags (it doesn't matter which one), it doesn't redirect. It only redirects when I try to insert both of them.



I've also tried putting the first script tag into the original page code (as it's not making any calls anywhere, it's just setting variables) and just inserting the conversions.js file and it still does the redirect.



If it's relevant I'm using Firefox 3.6.13, and have tried the included code with both jQuery 1.3 and 1.5 (after realizing we were using v1.3).



I know I'm missing something! Any suggestions?


More From » jquery

 Answers
123

If you're using jQuery in your pages, why don't you use the getScript method of the same to poll the conversion tracking script after setting the required variables?



This is what I usually do, once I've received a success response from my AJAX calls.



var google_conversion_id = <Your ID Here>;
var google_conversion_language = en;
var google_conversion_format = 3;
var google_conversion_color = ffffff;
var google_conversion_label = <Your Label here>;
var google_conversion_value = 0;
if (100) {
google_conversion_value = <Your value here if any>;
}
$jQ.getScript( http://www.googleadservices.com/pagead/conversion.js );


This works just fine for me. If you want a more detailed example:



$.ajax({
async: true,
type: POST,
dataType: json,
url: <Your URL>,
data: _data,
success: function( json ) {

// Do something
// ...

// Track conversion
var google_conversion_id = <Your ID Here>;
var google_conversion_language = en;
var google_conversion_format = 3;
var google_conversion_color = ffffff;
var google_conversion_label = <Your Label here>;
var google_conversion_value = 0;
if (100) {
google_conversion_value = <Your value here if any>;
}
$.getScript( http://www.googleadservices.com/pagead/conversion.js );

} // success
});


If you use other libraries such as Mootools or Prototype, I'm sure they have similar in-built methods. This AFAIK is one of the cleanest approaches.


[#93626] Monday, February 21, 2011, 14 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
mireyag

Total Points: 73
Total Questions: 107
Total Answers: 85

Location: Ukraine
Member since Sun, Dec 13, 2020
3 Years ago
mireyag questions
Sun, Aug 15, 21, 00:00, 3 Years ago
Wed, Dec 16, 20, 00:00, 3 Years ago
Tue, Sep 1, 20, 00:00, 4 Years ago
Sun, Jul 5, 20, 00:00, 4 Years ago
;