从表 php Angularjs 中删除选定的行

Question

i'm trying to delete multiple rows from table using angularjs and php, the problem i'm facing that i'm only able to delete one row each time !

this is my table:

<div class="table-responsive" style="overflow-x: unset;">           
    <button class="btn btn-danger" ng-click="deleteBulk()" >Delete</button>
    <table datatable="ng" dt-options="vm.dtOptions" class="table table-bordered table-striped" >
        <thead>
            <tr>                
                <th ><input type="checkbox" ng-model="master" > select</th>
                <th>date</th>
                <th>first name</th>
                <th>last name</th>
                <th>age</th>
                <th>action</th>
                <th>action</th>
                <th>action</th>
            </tr>
        </thead>
        <tbody>
            <tr id="<?php echo $row["id"]; ?>" ng-repeat="name in namesData">
                <td name="checkbox">
                  <input type="checkbox" name="arrExample"
                         ng-model="arrInput" ng-true-value="{{name.id}}"
                         ng-checked="master"
                         ng-click='pushInArray(name.id)'>
                </td>
                <td>{{name.date}}</td>
                <td>{{name.first_name}}</td>
                <td>{{name.last_name}}</td>
                <td>{{name.age}}</td>
                <td><button type="button" ng-click="fetchSingleData(name.id)"
                            class="btn btn-warning btn-xs">edit</button></td>
                <td><button type="button" ng-click="deleteData(name.id)"
                            class="btn btn-danger btn-xs">delete</button></td>
                <td><button type="button" ng-click="single_move(name.id)"
                            class="btn btn-success btn-xs">send</button></td>            
            </tr>
        </tbody>            
    </table>

and this is my Angular code:

$scope.exampleArray = [];
$scope.pushInArray = function(id) {
     // get the input value
     var inputVal = id;
     var array = $scope.exampleArray.push(inputVal);
     $scope.deleteBulk = function(){
        if(confirm("Are you sure you want to delete this record?")){
             $http({
                 method:"POST",
                 url:"insert.php",
                 data:{'id':id, 'action' : 'deleteBulk'}
             }).success(function(data){
                    $scope.success = true;
                    $scope.error = false;
                    $scope.successMessage = data.message;
                    $scope.fetchData();
             });
        }
    };   
};

and this is my php code inside insert.php

if($form_data->action == "deleteBulk")
{
    $query = "
     DELETE FROM orders WHERE id='".$form_data->id."'
    ";
    $statement = $connect->prepare($query);
    if($statement->execute())
    {
        $output['message'] = 'done!';
    }
}

can anyone tell me how to fix it please?

thank you

Answer 1

Don't define a scope function inside another scope function:

ERRONEOUS

$scope.exampleArray = []; $scope.pushInArray = function(id) { // get the input value var inputVal = id; var array = $scope.exampleArray.push(inputVal); $scope.deleteBulk = function(){ if(confirm("Are you sure you want to delete this record?")){ $http({ method:"POST", url:"insert.php", data:{'id':id, 'action': 'deleteBulk'} }).success(function(data){ $scope.success = true; $scope.error = false; $scope.successMessage = data.message; $scope.fetchData(); }); } }; };

BETTER

$scope.exampleArray = [];
$scope.pushInArray = function(id) {
    // get the input value
    var inputVal = id;
    $scope.exampleArray.push(inputVal);
};

$scope.deleteBulk = function(){
    if(confirm("Are you sure you want to delete this record?")){
         $http({
             method:"POST",
             url:"insert.php",
             data:{'id':id, 'action' : 'deleteBulk'}
         }).then(function(response){
             var data = response.data;   
             $scope.success = true;
             $scope.error = false;
             $scope.successMessage = data.message;
             $scope.fetchData();
         });
    }
};