我已经使用Angular和php pdo完成了Crud应用程序,我现在正尝试从表中选择多行,然后使用Submit按钮对其进行操作,但是我对Angular的了解到此为止了
<div class="table-responsive" style="overflow-x: unset;">
<table datatable="ng" dt-options="vm.dtOptions" class="table table-bordered table-striped" >
<thead>
<tr>
<th >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 ng-repeat="name in namesData track by $index" ng-class-even="'alternate-row'" >
<td name="checkbox">
<input type="checkbox" ng-model="row.checked" ng-style="row.checkboxStyle" />{{row.checked}}
</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">done</button></td>
</tr>
</tbody>
</table>
</div>
并且此按钮应该执行操作:
<button style="margin: 0 auto !important; display: block; text-align: center; width: 15%" type="button" ng-click="delete_multi(name.id)" class="btn btn-info btn-xl custom-btn">multi delete</button>
我的角度函数是:
var app = angular.module('crudApp', ['datatables']);
app.controller('crudController', function($scope, $http){
$scope.delete_multi = function(id){
if(confirm("Are you sure you want to remove it?"))
{
$http({
method:"POST",
url:"insert.php",
data:{'id':id, 'action':'Delete'}
}).success(function(data){
$scope.success = true;
$scope.error = false;
$scope.successMessage = data.message;
$scope.fetchData();
});
}
};
有人能告诉我正确的方法吗?谢谢
name
而不是row
,以便可以将选中的属性添加到当前项(如果您至少单击一次复选框,则将添加选中的属性计划继续使用同一集合,如果计划发送给他相同的对象以进行更新或其他操作,请确保删除此属性...)像这样...<div class="table-responsive" style="overflow-x: unset;">
<table datatable="ng" dt-options="vm.dtOptions" class="table table-bordered table-striped" >
<thead>
<tr>
<th >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 ng-repeat="name in namesData track by $index" ng-class-even="'alternate-row'" >
<td name="checkbox">
<input type="checkbox" ng-model="name.checked" ng-style="row.checkboxStyle" />{{name.checked}}
</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">done</button></td>
</tr>
</tbody>
</table>
</div>
而且我想您在当前作用域中有namesData
添加到delete_multi此...
var app = angular.module('crudApp', ['datatables']); app.controller('crudController', function($scope, $http){ $scope.delete_multi = function(){ let ids = $scope.namesData.filter(function(item){ return item.checked === true;//Keep only those with valid checked property }).map(function(item){ return item.id;//return just id }); if(confirm("Are you sure you want to remove it?")) { $http({ method:"POST", url:"insert.php", data:{'ids':ids, 'action':'DeleteMultiple'}//send a different action which internaly calls Delete action in php for each id }).success(function(data){ $scope.success = true; $scope.error = false; $scope.successMessage = data.message; $scope.fetchData(); }); } };