So, I hope you'll forgive the apparently off-topic nature of this post.
This is exactly what I want to happen, except for one instance. One of the Gridview row Cells (which corresponds to a TD element in the resulting markup) contains an <asp:HyperLink> control. When the user clicks on this HyperLink, a new window opens as it should. However, the 'onclick' event for the entire row also fires and the Gridview row ends up being selected.
As the <A HREF> element resulting from the HyperLink control is within the TR element which has the 'Select' onclick attribute, this onclick event is fired. I want to know how I can stop this.
To put it succinctly:
- I have a TR element with an 'onclick' attribute.
- I have an <A HREF> within the DOM hierarchy descending from the TR element.
- How can I stop the TR element 'onclick' attribute firing when I click on the <A HREF> link?
I've tried setting the 'onclick' event of the <A HREF> element to nothing, but it makes no difference.
A solution I have found is to replace the HyperLink control with a LinkButton control. I give the LinkButton an 'onclick' attribute which does a 'window.open' with the appropriate link. So the resulting behaviour is just like the HyperLink. But using a LinkButton involves a postback (albeit a dummy postback which does nothing at all other than reload the page), which wastes server resources and bandwidth. I could whack the LinkButton into an UpdatePanel to minimise this, but it still seems like overkill to me. And it would mean an UpdatePanel for each Gridview row, which is a lot of extra script for so simple a purpose.
So... any thoughts on this would be very much appreciated.
You should just be able to cancel the "bubble" event... see http://www.quirksmode.org/js/events_order.html
The code you want is in the section "Turning it off":
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
Visoft, Inc - Home | Blogs
Latest Blog Post: SQL 2008 x64 and VS2008 SP1
As well as solving the issue I had that is a very interesting read and I've bookmarked it for future reference.
Thanks again for your help, much obliged...
Sorry to raise the dead on this post, but I was hoping thats someone could help me zero-in on a similar issue:
I'm trying to figure out how to prevent bubbling to to the <Form>, to stop the postback in this case. I've tried the example above, but so far I've not been able to locate the correct place in the DOM to put the "stop bubbling" event handler.
myOSity Project Website, Blog