how do i delete multiple rows table using angular js with php

Question

Now this is my html code

                        <tr  ng-repeat="x in details| filter:maincode">
                        <td>{{x.maincode}}</td>
                        <td>{{x.subcode}}</td>
                        <td>{{x.trandate}}</td>


                        <button class="btn btn-primary" ng-click="deleteInfo(maincode)">
                        <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>Delete Data  </button>

when i click delete button all data will not deleted in selected maincode this is my controller js code

                        $scope.deleteInfo = function(info){


                             var x = confirm("Are you sure to delete the selected data");
                            if(x){
                                                $http.post('databases/dele_setlemnt_data.php', {"maincode":info.maincode}).success(function(data){
                                                    if (data == true) {
                                                     alert("Data has been deleted Successfully");   
                                                    getInfo();
                                                    }


                                                });
                        }   
                        }

After the click delete button i saw console data not post and not taken php page that is my php page code

          <?php             
            $data = json_decode(file_get_contents("php://input"));

            $maincode= mysqli_real_escape_string($con, $data->maincode);
            $query = "select * FROM trd_settle WHERE maincode= '{$maincode}' ";
                      echo $query;
            mysqli_query($con, $query);
            echo true;

i want to delete all data in one delete button click from the selected maincode..please tell me what is my mistakes now

Answer 1

change

ng-click="deleteInfo(maincode)"

to

ng-click="deleteInfo(x)"

Answer 2

<button class="btn btn-primary" ng-click="deleteInfo(maincode)">

Change this line as follows

<button class="btn btn-primary" ng-click="deleteInfo(x)">

And 'maincode' is column name, you should not pass that.

Here you are deleting row by row

If you want to delete selected maincode rows.

$scope.selectedIds = [];
$scope.deleteInfo = function () {
  angular.forEach(values, function(value) {
    if(value.maincode) {
      $scope.selectedIds(value.id);
    }
  }
}

You send to API layer ids and based on that delete DB rows.

Answer 3

hi check this to understand the difference

 var app = angular.module('app', []); app.controller('mainCtrl', function($scope) { $scope.details =[]; $scope.details.push({id:1,maincode:"maincode 1",subcode:"subcode 1"}); $scope.details.push({id:2,maincode:"maincode 2",subcode:"subcode 2"}); $scope.details.push({id:3,maincode:"maincode 3",subcode:"subcode 3"}); $scope.details.push({id:4,maincode:"maincode 4",subcode:"subcode 4"}); $scope.details.push({id:5,maincode:"maincode 5",subcode:"subcode 5"}); $scope.details.push({id:6,maincode:"maincode 6",subcode:"subcode 6"}); $scope.deleteInfo = function(maincode,info,idx){ console.log("maincode",maincode); //get obj data console.log("info",info); //show the index of list console.log("index",idx); //remove from list $scope.details.splice(idx, 1); }; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app"> <div ng-controller="mainCtrl"> <table> <tr ng-repeat="x in details"> <td>{{$index}}</td> <td>{{x.maincode}}</td> <td>{{x.subcode}}</td> <td> <button class="btn btn-primary" ng-click="deleteInfo(x.maincode,x,$index)">Delete</td> </tr> <table> </div> </div>