2

i am trying to create a confirmation dialog in angularjs, i found an answered question about that in stackoverflow Confirmation dialog on ng-click - AngularJS i tried it as it is answered but when i click cancel it works as if i clicked OK is the answer wrong or should i add something else

    <button type="button"  ng-click="updateData()" ng-confirm-click="Are you sure?">
            Update
    </button>

directive

    app.directive('ngConfirmClick', [
    function(){
        return {
            link: function (scope, element, attr) {
                var msg = attr.ngConfirmClick || "Are you sure?";
                var clickAction = attr.confirmedClick;
                element.bind('click',function (event) {
                    if ( window.confirm(msg) ) {
                        scope.$eval(clickAction)
                    }
                });
            }
        };
}])
Community
  • 1
  • 1
george
  • 97
  • 1
  • 12

2 Answers2

2

I had the same problem, and I solved using your same directive, but, instead of using ng-click for the final action on user confirmation, I did use the attribute confirmed-click with the final action as it's value.

html:

<button confirmed-click="confirm()" ng-confirm-click="Are you really sure?">Update</button>

directive:

app.directive('ngConfirmClick', [
    function() {
        return {
            link: function (scope, element, attr) {
                var msg = attr.ngConfirmClick || "Are you sure?";
                var clickAction = attr.confirmedClick;
                element.bind('click',function (event) {
                    if (window.confirm(msg)) {
                        scope.$eval(clickAction)
                    }
                });
            }
        };
    }
]);

See this fiddle.

MarcoS
  • 17,323
  • 24
  • 96
  • 174
  • the point is that the `confirm()` action should be called by the directive code, aftre the user has confirmend her choice.... With `ng-click`, the action is called on the first click... – MarcoS Jun 22 '16 at 10:03
0

The answer is write. Just Change "ng-click" to "confirmed-click" and it will work fine

<button type="button"  confirmed-click="updateData()" ng-confirm-click="Are you sure?">
            Update
    </button>

Just check plank Here

Viplock
  • 3,259
  • 1
  • 23
  • 32