Member Avatar for randomkid73

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!

  • 2 Contributors
  • 2 Replies
  • 133 Views
  • 13 Hours Discussion Span
  • Latest Post Latest Post by randomkid73
Member Avatar for GliderPilot

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

$("delete_img").live('click',function(e) {
  e.stopPropagation();
  //other actions here
});
Member Avatar for randomkid73

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!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.