How do I track (Google Analytics) individual file downloads when I use the <asp:hyperlink> tag?

I am familiar with tracking file downloads using this method:

<a href="http://www.example.com/files/map.pdf" onClick="javascript: pageTracker._trackPageview('/downloads/map'); ">

But now I need to track a file download using this code:

<asp:HyperLink ID="HyperLink3" runat=开发者_StackOverflow中文版"server" 
    NavigateUrl="~/Protected/Download.aspx?pfile=logos.zip" 
    ForeColor="Black" style="text-decoration:none"><b>Download<img src="../external_files/images/downloadzip.gif" 
    style="width: 40px; height: 40px" border="0" /></b>
</asp:HyperLink>

From what I found using the

onClick="javascript: pageTracker._trackPageview('/downloads/map');

will not work. I also read that onClick doesn't even work with asp:hyperlink.

I do not know ASP, what is the easiest way for me to track the download of this file? I have tried using a asp:linkbutton, but I haven't had success(I could be coding it wrong though).

EDIT:

Another way of explaining my problem is:

I came across this asp link that I need to track the file download, but I don't know asp or how to edit/rewrite the statement to do so.

---

Instead of asp:hyperlink, you might consider using another asp control that supports the OnClientClick attribute.

Another choice would be to use JavaScript (use your favorite library, i.e., jQuery) to attach the Google Analytics Event Tracking code to your asp:hyperlink:

jQuery("#GeneratedIDForHyperLink3").click(
    function() { 
        try { 
            pageTracker._trackEvent(categoryVal, actionVal, labelVal);
        } catch(err) {}
    });

You could do something like this in a document.ready() block.

UPDATE

You can use a asp:linkbutton, adding javascript to the OnClientClick to prevent posting the buttons click action to the server.

<asp:LinkButton ID="HyperLink3" runat="server" ForeColor="Black" Style="text-decoration: none" OnClientClick="javascript: pageTracker._trackPageview('/downloads/map');document.location = '/Protected/Download.aspx?pfile=logos.zip';return false;">
<b>Download<img alt="" src="../external_files/images/downloadzip.gif" style="width: 40px; height: 40px" border="0" /></b>
</asp:LinkButton>

Notice that OnClientClick calls your Google track event function, then changes the document location, and as a safety, returns false to prevent posting to the server.

I wouldnt call this a best practice and would personally consider doing it a different way.

---

Have you tried using OnClientClick? OnClick executes server side where as OnClientClick works on client side before control is passed to the server.

Try:

<script type="text/javascript">
    $(function () {
        function Foo() {
            javascript: window.open("~/Protected/Download.aspx?pfile=logos.zip");
        }
        $("#MyLinkButton").click(function () {
            javascript: pageTracker._trackPageview('/downloads/map');
        });
    });
</script>

<asp:LinkButton ID="MyLinkButton" runat="server" 
                Text="ClickMe" OnClientClick="Foo()" />

Or if you wanted to handle the page tracking on the server side, you could try something like-a-so:

<script type="text/javascript">
    $(function () {
        function Foo() {
            javascript: window.open("~/Protected/Download.aspx?pfile=logos.zip");
        }
    });
</script>

<asp:LinkButton ID="MyLinkButton" runat="server" 
                Text="ClickMe" OnClientClick="Foo()" OnClick="MyLinkButton_Click" />

// Server side code
public void MyLinkButton_Click (object sender, EventArgs e)
{
    pageTracker._trackPageview('/downloads/map');
}

When I originally asked what your asp:LinkButton code looked like, I was sure it looked similar to your asp:HyperLink code that you posted but asp:LinkButton doesn't have an attribute for 'NavigateUrl'. Let me know if this is more along the lines of what you're trying to do.

---

You can always override the OnLoad() method and set the onClick attribute that way. For example:

protected override void OnLoad(EventArgs e)
{
     base.OnLoad(e)
     this.Attributes["onClick"] = "javascript: pageTracker._trackPageview('/downloads/map'); ";
}