angularjs.js下的批量删除代码实现
程序员文章站
2023-03-30 18:36:17
废话不说,老规矩上代码
批量删除 要想批量删除得获取到勾选框对应的id 并且传到controller 里面接收的必定是一个数组,,在后端代码中要想删除 需要先遍历数组在进行删除...
废话不说,老规矩上代码
批量删除 要想批量删除得获取到勾选框对应的id 并且传到controller 里面接收的必定是一个数组,,在后端代码中要想删除 需要先遍历数组在进行删除
例:第一步 想批量删除下面多个数据 在angularjs.js 中 我们可以使用固定写法 获取勾选框的ID ng-click="updateSelection($event,entity.id)"
通过ng-clic 写一个单击事件 里面传$event,entity.id 就可以了
<tbody> <tr ng-repeat="entity in list"> <td><input type="checkbox" ng-click="updateSelection($event,entity.id)"></td> <td>{{entity.id}}</td> <td>{{entity.name}}</td> <td>{{entity.firstChar}}</td> <td class="text-center"> <button type="button" class="btn bg-olive btn-xs" data-toggle="modal" ng-click="findOne(entity.id)" data-target="#editModal">修改</button> </td> </tr> </tbody>
第二步:
在js页面中 实现上面的单击事件的方法 并传上参数 $event,id(固定写法),接着定义一个数组 (selectIds ) 然后再判断我们在页面中是否勾选了数据,如果勾选了的话讲数据的ID push给刚刚定义的数组 如果取消勾选了则通过 splice 删除取消勾选的ID,
然后把存储了id的数组传到删除方法中
细节:记住由于我们定义的数组时是在 $scope 里面的 所以如果我们想要拿该数组的话一定要通过 $scope来拿 标紫色 ($scope.selectIds )
//获取选中的ID $scope.selectIds=[]; //定义一个数组 $scope.updateSelection=function($event,id){ //实现获取勾选框ID的方法 if($event.target.checked){ //判断是否勾选了数据 $scope.selectIds.push(id); //勾选了的haul则就把id push到数组中 }else{ $scope.selectIds.splice($scope.selectIds.indexOf(id), 1); //如果取消则就删除勾选时存的id,后面的1代表删除几个,固定写法默认为1,因为就算取消勾选也只能一个一个的取消 } }; //删除方法 $scope.dele=function(){ $http.post("../brand/dele?ids="+$scope.selectIds).success(function(data){ if(data.success){ //判断返回值是否为true 是则刷新页面 $scope.reloadList(); }else{ alter("删除失败"); //失败则提示 } }) }
推荐阅读
-
Python批量发送post请求的实现代码
-
怎么把对应信息下的所有图片全部删除?小弟我的代码只删除一张图片。
-
python批量删除文件名中的下划线-代码详解
-
php下通过curl抓取yahoo boss 搜索结果的实现代码_PHP教程
-
php遍历文件夹并实现编辑与删除的代码
-
js下通过prototype扩展实现indexOf的代码_javascript技巧
-
javascript下搜索子字符串的的实现代码(脚本之家修正版)_javascript技巧
-
Android listview ExpandableListView实现多选,单选,全选,edittext实现批量输入的实例代码
-
Java 读取类路径下的资源文件实现代码
-
spring boot实现软删除的示例代码