How to delete multiple rows from table using Angular.js?

Question

I'm trying to delete multi rows from table using checkbox with Angular and php , but i'm not able to get that to work and my knowledge with Angular stoped here !

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':$scope.exampleArray, '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 what i'm doing wrong please ? thank you

You need to convert example array into comma (,) separated string then get it into PHP. — Santosh Anand
– Santosh Anand, Commented Nov 13, 2019 at 11:17

Jing Yu · Accepted Answer · 2019-11-13 12:41:55Z

1

You are deleting one row each time with a unique id. So code base is correct.

To delete multiple rows, use the checkbox in each row and user will select multiple rows to delete and then delete rows by multiple ids.

You will also need to update SQL query to delete multiple rows at a time.

Something like below

DELETE FROM orders WHERE id IN (1, 2, 3, 4, ..., 10);

answered Nov 13, 2019 at 12:41

Jing Yu

1,63113 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Max Over a year ago

i'm already using the checkbox in each row , but i don't know why i'm able to delete only one row each time :/

Jing Yu Over a year ago

Yes. because you are probaly sending one id to the back end. And sql query is also to delete one row. You will need to update both API and SQL query. Send ids like array and apply it to the query.

Collectives™ on Stack Overflow

How to delete multiple rows from table using Angular.js?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related