Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Confirm dialog box in angularjs

How can I apply confirm dialog box in below button in angularjs ?

<button class="btn btn-sm btn-danger" ng-click="removeUser($index)">Delete</button>

Just like this.

<span><a class="button" onclick="return confirm('Are you sure to delete this record ?')" href="delete/{{ item.id }}">Delete</span>

Update

Currently I am doing it like this

    function removeUser(index) {
      var isConfirmed = confirm("Are you sure to delete this record ?");
      if(isConfirmed){
        vm.users.splice(index, 1);
      }else{
        return false;
      }
    };
like image 523
Believe It or Not Avatar asked Feb 19 '16 09:02

Believe It or Not


People also ask

How to use confirm box in AngularJS?

Confirmation dialog can implemented using AngularJS Material: $mdDialog opens a dialog over the app to inform users about critical information or require them to make decisions. There are two approaches for setup: a simple promise API and regular object syntax. Show activity on this post.

What is $modal in AngularJS?

From an AngularJS perspective, a modal window is nothing more than a Controller than manages a View-Model, interacts with Services, and is rendered by a View. The same it true for every other UI-oriented component in your AngularJS application.


2 Answers

Here is the snippets,

how your HTML should be,

<button class="btn btn-sm btn-danger" ng-confirm-click="Are you sure to delete this record ?" confirmed-click="removeUser($index)">Delete</button>

Please Include this directive in your custom angularjs file,

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)
                    }
                });
            }
        };
}])

Your angular scope based on your delete function mentioned above,

$scope.removeUser = function(index) {
    vm.users.splice(index, 1);
}
like image 172
Mohideen bin Mohammed Avatar answered Sep 22 '22 18:09

Mohideen bin Mohammed


$scope.removeUser= function (ind){
 if (confirm("Are you sure?")) {
    alert("deleted"+ s);
    $window.location.href = 'delete/'+ s;
 }
}

http://jsfiddle.net/ms403Ly8/61/

like image 45
a.u.b Avatar answered Sep 18 '22 18:09

a.u.b