Menu
I have a table row with ONCLICK event (that toggles additional data below). Inside one of the row cells I have a button (when clicked is performing an AJAX action). When I click on the button - the Row's onclick event also fires and what happens is that the additional data appears before the AJAX call completes (which is a bad behavior for me). Any ideas how can I solve this elegantly? (without identifying and coding it into the row's onclick code) Thanks
894
Add an event.stopPropagation (); to your buttons click handler. For more information, have a look here. If you dislike the javascript solution, in many cases a CSS solution is possible as well: That will supress the <tr> onclick event. However, in some cases I still had issues where it didn't seem to work.
Use HTML DOM stopPropagation () method to stop the event from propagating with inline onclick attribute which is described below:
Example 1: This example stops the event propagation by adding stopPropagation method on onclick the <span> element. Example 2: This example stops the event propagation by adding stopPropagation () method on onclick to the <span> element. This example handles the Internet Explorer case by setting window.event.cancelBubble to true.
Add an event.stopPropagation(); to your buttons click handler. For more information, have a look here.
194
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
