0

Based on the example given here I have written a directive to display a confirmation dialog in Angular when a button is clicked. The problem is even after the user clicks on the cancel button on the confirmation dialog, the ng-click action gets triggered.

This is the directive:

app.directive('ngConfirmClick',function(){
return {
    link: function(scope, element, attr) {
    var msg = attr.ngConfirmClick;
    var clickAction = attr.ngClick;
    attr.ngClick = "";
    element.bind('click', function(event) {
      if(window.confirm(msg)){
        scope.$eval(clickAction);
      }
    });
    }
  }
});

This is the section of my index.html that has the ng-confirm-click directives:

<input class="delete" type="button" value="" ng-click="delete(item._id)" 
ng-confirm-click="Are you sure you want to delete?">

I tried setting a priority of -1 for the ng-confirm-click directive and that did not help either. When I was debugging the code on firebug, I found that window.confirm DOES return false when the user clicks on Cancel, so I am not sure why the ng-click (clickAction in the directive code above) is getting executed. Is there a way to stop propagating the click action if window.confirm returns false? Any help would be appreciated.

Community
  • 1
  • 1
Sriprabha
  • 99
  • 1
  • 8

0 Answers0