Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to continue event propagation after cancelling?

When a user clicks a certain link I would like to present them with a confirmation dialog. If they click "Yes" I would like to continue the original navigation. One catch: my confirmation dialog is implemented by returning a jQuery.Deferred object which is resolved only when/if the user clicks the Yes button. So basically the confirmation dialog is asynchronous.

So basically I want something like this:

$('a.my-link').click(function(e) {   e.preventDefault(); e.stopPropogation();   MyApp.confirm("Are you sure you want to navigate away?")     .done(function() {       //continue propogation of e     }) }) 

Of course I could set a flag and re-trigger click but that is messy as heck. Any natural way of doing this?

like image 229
George Mauer Avatar asked Oct 18 '11 18:10

George Mauer


People also ask

What is event propagation how can we stop event propagation?

The stopPropagation() method prevents propagation of the same event from being called. Propagation means bubbling up to parent elements or capturing down to child elements.

How can we stop event propagation to children?

To stop event capturing, you can utilize the “event. stopPropagation()” method. The difference between stopping the event capturing and event bubbling is that, in event bubbling, we attached the “event. stopPropagation()” method with the event related to the child element, whereas, in event capturing, the event.

Which event can be used to stop event propagation in react?

stopPropagation() within a ReactJS component to stop a click event from bubbling up and triggering a click event that was attached with JQuery in legacy code, but it seems like React's stopPropagation() only stops propagation to events also attached in React, and JQuery's stopPropagation() doesn't stop propagation to ...

How do I stop event propagation in HTML?

The HTML DOM stopPropagation() event method is used for stopping the propagation of the given element. This means that clicking on the parent element won't propagate to children and clicking on the children elements won't propagate to parent using the stopPropagtion() method.


1 Answers

Below are the bits from the code that actually worked in Chrome 13, to my surprise.

function handler (evt ) {     var t = evt.target;     ...     setTimeout( function() {         t.dispatchEvent( evt )     }, 1000);     return false; } 

This is not very cross-browser, and maybe will be fixed in future, because it feels like security risk, imho.

And i don't know what happens, if you cancel event propagation.

like image 162
c69 Avatar answered Sep 20 '22 12:09

c69