Question

Maybe I’m going about this the wrong way (I wouldn’t be too surprised) or maybe it’s just not possible. I have links that when clicked on, download a file. I would also like to have these links show a lightbox. I can easily get them to do one or the other, but not both. The links are also being created through asp. The code I have right now:

<asp:Label id=Label1 EnableViewState="False" runat="server" Text='<%# "<A  id=""launcher"" class=""track"" Href="""&amp;DataBinder.Eval(Container, "DataItem.Url")&amp;""">"&amp;DataBinder.Eval(Container, "DataItem.Name")&amp;"</A>" %>'>
</asp:Label>

Within the <A>, I have tried: onclick=""test();return false;"", the same thing except with onclientclick, with and without the return false; (also tried true).

The function I have:

function test() {
  window.location.href="#feature";
}

Problem is that it never does the onclick event. I tried putting a breakpoint at that spot, which gets hit when I click the link, but I never see the content that should be displayed. Is what I’m trying to do even possible, this way or some other way?

jsFiddle: http://jsfiddle.net/hk3Wd/6/. This is behaving slightly differently than on the website I’m working on. On the website, the lightbox shows but no download. In that fiddle, the download starts but not lightbox.

Answer 1

Thanks to some suggestions from Diodeus and others found online, I have figured this out.

Diodeus was correct in that I had two instances of id=launcher, one of which was unnecessary. I removed that.

The other was in the way Fancybox seems to work. It uses the href attribute to determine what to fill the frame with. In this case href was set to a file (exe), so it was trying to display the executable in the lightbox frame rather than actually downloading it.

To fix this, I set the onclick of the <a> tag to a JS function. That function:

function test() {
   $("a.launcher").trigger("click");
}

Within my hidden div, I added:

<a class="launcher" href="#ads"></a>

Basically, the onclick calls the function which triggers the hidden link which launches the lightbox.

jsFiddle: http://jsfiddle.net/FjgRw/1/