Sign in

Analytics Help



How do I track AJAX applications?

Print
Note: This article is for the older version of the tracking code. If you are using the newer version, please read the following article.

To determine which tracking code you are using, please see Which version of the tracking code am I using?

With a typical HTML page, you can use the URL to differentiate between multiple pageviews. But in an AJAX application, a request to the server is made without changing the URL of the page, making it difficult to track.

By calling Analytics' urchinTracker function, however, you can assign a page filename to any AJAX event. Typically, this is done as part of the onreadystatechange function, after the data has been returned and all updates to the page have been made. The example below shows one way of doing this:


...

        http_request.onreadystatechange = sendAlert;
        http_request.open('GET', url, true);
        http_request.send(null);

}

    function sendAlert() {

        if (http_request.readyState == 4) {
            if (http_request.status == 200) {
                alert(http_request.responseText);
                urchinTracker("/pagefilename1" );
            } else {
                alert('Error.');

...

The urchinTracker variable (/pagefilename1 in the example above) can be any value, which will be displayed as a page filename in your Analytics reports.

Important: if your pages include a call to urchinTracke_(), utmLinker(), utmSetTrans(), or utmLinkPost(), your Analytics tracking code must be placed in your HTML code above any of these calls. In these cases the tracking code can be placed anywhere between the opening <body> tag and the JavaScript call.

Was this information helpful?

Learn from other users

Find answers, ask questions, and share your expertise with others in the Analytics help forum.