How to add an confirmation window on ng-click Angular
Solution 1
It is easy, you have 2 functions
<a confirmed-click="makeUnfavourite(favourite.userId,$index)" ng-confirm-click="Confirm unfavorite?">Un-Favourite</a>
Now you could call $scope.remove
function inside makeUnFavorite, or, inside confirmed-click, like this:
<a confirmed-click="makeUnfavourite(favourite.userId,$index);remove(favouriteData.data.result,$index);" ng-confirm-click="Confirm unfavorite?">Un-Favourite</a>
I prefer first solution. Complete code:
Controller
var userControllers = angular.module('userControllers', ['ui.bootstrap','gm']);
userControllers.controller('myProfileCtrl', function ($scope, $routeParams, $rootScope, $http, $location, $window, $timeout) {`
$scope.makeUnfavourite=function(id,index,favourite){
var indextoremove=index;
var currentuserid=2;
var favUserId=id;
console.log(favUserId);
var params = {
currentuserid:2,
favUserId:id
};
if(favUserId){
$http.post($rootScope.STATIC_URL + 'users/makeUnFavourite', params).success(function(response){
$scope.favHide=response;
//here we call the remove function, always inside the $http response for not having async issues
$scope.remove(favourite,index);
}).error(function(err){
console.log("Error"+err);
});
}
};
$scope.remove = function(favourite,index){
favourite.splice(index,1);
};
});
HTML
<a confirmed-click="makeUnfavourite(favourite.userId,$index,favouriteData.data.result)" ng-confirm-click="Confirm unfavorite?">Un-Favourite</a>
EDIT
One more thing, it would be better if you use on $http.post this structure:
$http.post($rootScope.STATIC_URL + 'users/makeUnFavourite').then(function(response){
//Ok response stuff
}, function(error){
//Error response stuff
});
Solution 2
Simply use ng-confirm-click, like this:
<h4><a href="" confirmed-click="confirmedAction()" ng-confirm-click="Do you confirm?">Un-Favourite</a></h4>
UPDATE: For angular directives, see here...
UPDATE 2: I see. You could simply do:
$scope.confirmedAction = function() {
makeUnfavourite(favourite.userId, $index);
remove(favouriteData.data.result, $index);
};
sulu666
Updated on August 22, 2022Comments
-
sulu666 almost 2 years
I have a link with ng-click. I need a confirmation window on that click.
<h4><a href="" ng-click="makeUnfavourite(favourite.userId,$index);remove(favouriteData.data.result,$index)">Un-Favourite</a></h4>
currently it includes 2 functions. I have to execute this two functions only after confirmation. my two functions are defined in usercontroller.js.plz see code below
var userControllers = angular.module('userControllers', ['ui.bootstrap','gm']); userControllers.controller('myProfileCtrl', function ($scope, $routeParams, $rootScope, $http, $location, $window, $timeout) {` $scope.makeUnfavourite=function(id,index){ var indextoremove=index; var currentuserid=2; var favUserId=id; console.log(favUserId); var params = { currentuserid:2, favUserId:id }; if(favUserId){ $http.post($rootScope.STATIC_URL + 'users/makeUnFavourite', params).success(function(response){ $scope.favHide=response; }).error(function(err){ console.log("Error"+err); }); } }; $scope.remove = function(favourite,index){ favourite.splice(index,1); }; });
I have to execute makeUnfavourite() & remove() function on confirmation.I am fresher in angular. Now I am working in a partially finished project
-
sulu666 about 8 yearsin my application I have written functons in controller as like below: $scope.getAllFavourite=function(id){-------};. How to write the above functions (app.directive) like i wrote?. I am new to angular
-
MarcoS about 8 yearsSorry, I don't fully understand... Do you want to write a directive? See my update to answer... But to answer to your question you can just use angular.js built-in directive
ng-confirm-click
... -
sulu666 about 8 yearsbut browser shows error that the above two functions are undefined?
-
sulu666 about 8 yearsWorking fine.easy method without using directives. This is what i expect. Thanks
-
sulu666 about 8 yearsMarco. if I place the two functions inside $scope.confirmedAction() method, the application did not execute that functios.But when i give like this, it works fine : makeUnfavourite(favourite.userId,$index);remove(favouriteData.data.result,$index);. thanks . But ur directive is working fine
-
Programador Adagal about 8 yearsMark Answer as correct for any other user (you could vote too if it helped you)
-
Karthik about 7 yearsCan we call a function on click of "Cancel" in the confirmation dialog ?
-
Avnesh Shakya over 6 years@MarcoS, Is there any possibility here to disable system generated the top line which says: An Embedded page at run.plunk.co says.