Hi all,

I have a table on a page that is generated from MySQL database entries via AJAX request. I have a .live() event for the table rows in that table, $(#myTable tbody tr).live('click', func...), which opens a jQuery UI dialog window with extra information from the table row. In the last cell of the row, I have icons for "quick actions" (delete, edit, etc). I have bound these images to .live() events as well, however when they are clicked the image's .live() executes, then so does the one from the $('#myTable tbody tr).live(). Is there something to do to prevent the second .live event from executing?

If it makes a difference, the icon .live is located above the table .live. I can post any code that's needed, but I feel like what I've provided should clearly state the problem. Thanks in advance!

4 Years
Discussion Span
Last Post by randomkid73

Add a stopPropagation() call to the live functions on your action images, ie:

$("delete_img").live('click',function(e) {
  //other actions here

Yep, that did it. I came across this when reading but I was confused by this quote from the jQuery docs:

Since the .live() method handles events once they have propagated to the top of the document, it is not possible to stop propagation of live events.

I understood that as ".stopPropagation() does not work for .live() method" which appears false now. Thanks!

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.