Track ajax application with google analytics

Hi everyone,

I have an ecommerce application where i use ajax in createUserWizard and in Chart.
To track user activity i use google analytics urchinTracker function.
With ajax a request to the server is made without changing the url of the page, so i have to call urchinTracker function with onreadystatechange.
http://www.google.com/support/analytics/bin/answer.py?answer=33985&topic=7292

The problem is how can i use this code. How i can insert it inside my page.

I have the urchinTracker function in my masterpage:
<scripttype="text/javascript">
_uacct ="UA-XXXXXXXX;
urchinTracker();
</script>

In my content page i have a MultiView control inside the UpdatePanel.
When i skip the step inside the multiView i need to call the urchinTracker function to assign a page filename for the tracking.
How can i do that?

This solution don't work:

ProtectedSub Page_PreRender(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.PreRender

If mvCreaUtente.ActiveViewIndex = 0Then
Dim sbAsNew System.Text.StringBuilder
sb.Append("<script>")
sb.Append("urchinTracker('/registrazione/step1.html')")
sb.Append("</")
sb.Append("script>")
Me.Page.RegisterClientScriptBlock("ScriptUrlTracking", sb.ToString)
EndIf

End Sub

Thanks

You should set it up in javascript. Tie the endRequest event of the PageRequestManager to a function that will call the urchin tracker function.

Thanks Paul for your reply. Could you please write a simple example of this javascipt code?

Thx

Be happy to. Something like this:

function handleUrchin(ev){ urchinTracker('/registrazione/step1.html');}function pageLoad(){ var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_endRequest(handleUrchin);}

Obviously that's pretty simple, and you could add a switch statement or something if you have more than one type of urchin request to do.

Thanks Paul, your reply help me!

Trying to hide controls on UpdatePanel

I have an UpdatePanel on which there sits a dropdownlist of providers and two labels that show the providers AU and Activity #. When the selectedIndex of the dropdown is zero, I want to hide the labels. I have tried both asp:panel controls with height=0 set in the code behind SelectedIndexChanged event and html div with style.visibility = 'hidden' in a javascript onchange event for the dropdown, and neither does anything. No errors, it just doesn't do anything. Here is my page code.

<asp:UpdatePanel id="UpdatePanel1" runat="server">
<contenttemplate>
<asp:DropDownList id="ddlProviders" runat="server" AutoPostBack="True" OnSelectedIndexChanged="ddlProviders_SelectedIndexChanged"></asp:DropDownList>
<BR />
<DIV style="WIDTH: 100%; HEIGHT: 100%" id="divProviderDetail" noWrap>
<asp:Label id="Label1" runat="server" Text="AU#: " __designer:wfdid="w20"></asp:Label>
<asp:Label id="lblProviderAU" runat="server" __designer:dtid="844424930132022" __designer:wfdid="w17"></asp:Label> <BR />
<asp:Label id="Label2" runat="server" Text="Activity #: " __designer:wfdid="w21"></asp:Label>
<asp:Label id="lblActivityNumber" runat="server" __designer:dtid="844424930132024" __designer:wfdid="w18"></asp:Label>
</DIV>
<BR />
</contenttemplate>
</asp:UpdatePanel>

Any ideas? Thanks.

Protected Sub ddlProviders_SelectedIndexChanged(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles ddlProviders.SelectedIndexChanged
If (ddlProviders.SelectedIndex = 0)Then
lblProviderAU.Visible =False
lblActivityNumber.Visible =False
Else
lblProviderAU.Visible =True
lblActivityNumber.Visible =True
End If
End Sub

Or you could use a panel and set Visible = False for that.

whats the code you using at ddlProviders_SelectedIndexChanged

coz the aspx looks fine here

When I used a panel, I set height=0 so as to not leave a big blank spot. That didn't do anything, height was still the same.

If you don't want anything to move, then just change their text to "" rather than changing their height or visibility.

Setting an element's display CSS property to 'none' is a good way to hide elements on the client side. It has the advantage of not removing them from the DOM or rendered HTML (as is the case with those other methods), so you can still manipulate them on the client side later if need be.

document.getElementById('lblAU').class = 'none';

gave me an error when VS scanned the .js file at start. What is the correct syntax?

document.getElementById('lblAU').style.display = 'none';

or if you have a css class

.hide {display: none;}

document.getElementById('lblAU').className = 'hide';