Angularjs：確認ボックス付きでng-repeatテーブルから行を削除する

削除ボタンをクリックしてng-repeatテーブルから行を削除したいとします。ボタンは正常に機能しますが、削除ボタンをクリックした後に確認ボックスを表示したい場合は、ユーザーが「はい」を選択した場合にのみ、その特定の行を削除する必要があります。誰にでも解決策がありますか？Angularjs：確認ボックス付きでng-repeatテーブルから行を削除する

 <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>

出典

2017-12-10 Manisha Chavan

ブートストラップモーダルを使用できます。例[here]（https://stackoverflow.com/a/29602528/6744399） – pavelety

javascriptの確認機能を使用できます。読む：https://www.w3schools.com/jsref/met_win_confirm.asp

を使用すると、削除httpリクエストを行う前に確認ステップを追加し、それを使用するには：

$scope.remove = function(index,xid){ 
    var url = "remove.php?xid="+xid; 
    if(confirm("Do you really want to delete entry " + xid + "?\nConfirm with ok.")){ 
     $http.get(url).then(function successCallback(response) { 
       $scope.names.splice(index, 1); 
       $http.get("getData.php").then(function (response) { 
        $scope.names = response.data.records; 
       }); 
      }); 
    } 
}

確認ダイアログのダイアログボックスでユーザーを押す「OK」場合にtrueを返します。彼が 'キャンセル'を押すと、関数はfalseを返し、この場合は何も起こりません。

編集：if文の後に別の "）"を追加しました。

出典

2017-12-10 18:48:39 JonasHu

確認ボックスが表示されません –

@ManishaChavanはい、申し訳ありません。 if文の後に2番目の親「）」が見つかりませんでした。編集された答えを参照してください。 – JonasHu

まだ仕事をしていません –

Angularjs：確認ボックス付きでng-repeatテーブルから行を削除する

答えて

関連する問題