I want to delete a row from ng-repeat table by clicking a delete button. The button works correctly but i want to show a confirmation box after clicking delete button if the user selects yes then only it should delete that particular row otherwise not. anyone have any solution?
<script>
var app= angular.module("myapp",[]);
app.controller("mycontroller",function ($scope, $http)
//get data from database
{
$http.get("getData.php").then(function (response) {
$scope.names = response.data.records;});
//Remove record
$scope.remove = function(index,xid){
var url = "remove.php?xid="+xid;
$http.get(url).then(function successCallback(response) {
$scope.names.splice(index, 1);
$http.get("getData.php").then(function (response) {
$scope.names = response.data.records;
});
});
});
</script>
<body ng-app ="myapp" ng-controller="mycontroller">
<table border=1>
<tr ng-repeat="x in names | filter: searchText | orderBy:sortColumn">
<td>{{x.Bank}}</td>
<td>{{x.cname}}</td>
<td >{{x.cfees}}</td>
<td>{{x.fpaid }}</td>
<td ng-model="bfess">{{x.cfees-x.fpaid}}</td>
<td>{{x.sdate | date:'dd-MM-yyyy'}}</td>
<td>{{x.edate | date:'dd-MM-yyyy'}}</td>
<td>{{calDate(x.edate,x.sdate)}}</td>
<td>{{calDate(x.edate,getToday()| date:'dd-MM-yyyy')}}</td>
<td><button type="button" class="btn btn-danger" ng-click="remove($index,x.id);" value="Delete">Delete</button></td>
</tr>
<tr>
<td>Total fess paid by students: {{ calcTotal(names) }}</td>
</tr>
</table>
You can use javascript's confirm function. Read: https://www.w3schools.com/jsref/met_win_confirm.asp
To use it you would add a confirmation step before making the delete http request:
The confirm dialog returns true if the user presses 'ok' in the shown dialog box. If he presses 'cancel' the function returns false and in this case, nothing will happen.
Edit: added another ")" after the if statement.