asked on

Need to add OnClick code to an ImageMap

I have an imagemap with 3 hotspots. One downloads a .pdf, the other two redirect to two other websites. Now they want to be able to track who downloads the .pdf file with our reporting program (VisiStat). To do that, I have to add some code to the OnClick event of the .pdf hotspot.

<A ONCLICK="VSLT('MyFile.pdf')" TARGET="new" HREF="my-link.pdf">MyFile.pdf</A>

Open in new window

The code in the "VSLT('MyFile.pdf')" can be any name, that's just what shows up in the reports.
I've tried doing this with a code behind OnClick event handler, but it can't see the javascript included in the asp in the asp page:

<!--VISISTAT SNIPPET//-->
<script type="text/javascript">    var DID = 12345;</script>
<script src="http://sniff.visistat.com/sniff.js" type="text/javascript"></script>
<!--VISISTAT SNIPPET//-->

Open in new window

And I'm guessing that's where the VSLT() code is at.

I tried moving my code inline in the asp page, but it always says my sub is not a member of the page. What am I doing wrong? It seems like I'm just calling it or referencing it wrong.
The only code I have in it is an If/Else for the postback values.

carrefour

ASKER

Here is the imagemap code:

<center><asp:ImageMap ID="Green_Bar_ImageMap" runat="server" HotSpotMode="PostBack" OnClick="ImageMap_Click()" ImageUrl="http://www.somedomain.com/Images/Heart-RightBodyImage.gif" Height="828" Width="206" ImageAlign="Top" CssClass="Right_Column">
<asp:RectangleHotSpot AlternateText="End Stage Heard Disease and Palliative Care" PostBackValue="PDF" Top="321" Right="185" Bottom="520" Left="30"/>
<asp:RectangleHotSpot AlternateText="Source 1" PostBackValue="source1" Top="726" Right="192" Bottom="758" Left="30"/>
<asp:RectangleHotSpot AlternateText="Source 2" PostBackValue="source2" Top="780" Right="192" Bottom="798" Left="30"/>
</asp:ImageMap></center>

Open in new window

Here is the function to handle it (right now in-line in the page):

<script type="text/VBScript">
        Protected Sub ImageMap_Click(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ImageMapEventArgs)
                If (e.PostBackValue.Contains("PDF")) Then
                          VLST("HeartDiseaseWP.pdf")
                          Response.Redirect("http://www.somedomain.com/WhitePapers/HeartDiseaseWP.pdf")

                ElseIf (e.PostBackValue.Contains("source1")) Then
                           Response.Redirect("http://www.otherdomain.com/questions/end-stage-congestive-heart-failure")

                ElseIf (e.PostBackValue.Contains("source2")) Then
                            Response.Redirect("http://www.otherdomain.org/")
                End If
        End Sub
</script>

Open in new window

strickdd

The "OnClick" function calls a method in the code-behind. You have to wire up the javascript method for this. This is most commonly done by adding the following OnPageLoad in the code-behind:

myControlID.Attributes.Add("onclick", "VSLT('MyFile.pdf')");

I'm not sure if this will work with the controls you are using, but you can try.

carrefour

ASKER

There really are no controls. The page is mainly two images, one is an image map with 3 hotspots. So an imagemap is the only real 'control'. I don't have access to the VSLT code or functions, just the included script that references it.

strickdd

Did you try adding this to the ImageMap control?

carrefour

ASKER

I didn't figure that it would both call their code and still redirect. I just tried it and get the same sort of error. In the imagemap code it says that VSLT is not a member of the asp page and also an 'expression exprected' error in the imagemap code.

here is the imagemap code now:

<center><asp:ImageMap ID="Green_Bar_ImageMap" runat="server" HotSpotMode="Navigate" OnClick="VSLT('HeartDiseaseWP.pdf')" ImageUrl="http://www.ourdomain.com/Images/Heart-RightBodyImage.gif" Height="828" Width="206" ImageAlign="Top" CssClass="Right_Column">
   <asp:RectangleHotSpot AlternateText="End Stage Heard Disease and Palliative Care" Top="321" Right="185" Bottom="520" Left="30" NavigateUrl="http://www.ourdomain.com/WhitePapers/HeartDiseaseWP.pdf"/>
   <asp:RectangleHotSpot AlternateText="Source 1" Top="726" Right="192" Bottom="758" Left="30" NavigateUrl="http://www.otherdomain.com/questions/end-stage-congestive-heart-failure"/>
   <asp:RectangleHotSpot AlternateText="Source 2" Top="780" Right="192" Bottom="798" Left="30" NavigateUrl="http://www.otherdomain.org/"/>
</asp:ImageMap></center>

Open in new window

strickdd

In .Net controls the "OnClick" declaration raises the Click event. Since VSLT() is not a method in your code-behind file, it is erroring. That is why you need to use the .Attributes.Add() method to get the javascript "onclick" method on the control.

carrefour

ASKER

Ok, I follow what you are saying, but not sure I know how to do that.

If I am understanding correctly, in the PageLoad event, I need to have a line like this:

ImageMapID.Attributes.Add("onclick", "VSLT('MyFile.pdf')")

Then put the rest of the code in the OnClick event of the page behind? I wrote it up once like that, but without the .Add().

strickdd

The point is, the VSLT() is a javascript method contained withing the .js file. there is no server-side code associated with it.

carrefour

ASKER

I understand that. Will the .Add() method fix that? In my last post, am I understanding correctly?

ASKER CERTIFIED SOLUTION

strickdd

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

carrefour

ASKER

I didn't get the final fix. The website got relocated before I could complete it but since this member was trying so hard to help me I think he deserved the points.