AngularJS的批量操作

最新推荐文章于 2018-09-20 13:49:35 发布

皮蛋小粥

最新推荐文章于 2018-09-20 13:49:35 发布

阅读量792

点赞数 1

分类专栏： AJAX 微信小程序

本文链接：https://blog.youkuaiyun.com/qq442270636/article/details/77803629

版权

微信小程序同时被 2 个专栏收录

21 篇文章

订阅专栏

AJAX

12 篇文章

订阅专栏

本文介绍了如何使用JavaScript实现批量修改功能，通过选择复选框收集要修改项的ID，并将其存储在一个数组中。当触发修改操作时，该数组被传递给后端进行批量更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天做一个批量修改的需求,算是对JS的学习吧。

界面：

<input type="checkbox" ng-model="isSelected(item.id)" ng-click="updateSelection=function ($event,item.id)">

JS：

$scope.selected =[];

        var updateSelected=function (action,id) {
            if (action == 'add' && $scope.selected.indexOf(id) == -1){
                $scope.selected.push(id);
            }
            if (action == 'remove' && $scope.selected.indexOf(id) != -1){
                var idx=$scope.selected.indexOf(id);
                $scope.selected.splice(idx,1);
            }
            //console.log($scope.selected)
        }
        $scope.updateSelection=function ($event,id) {
            var checkbox = $event.target;
            var action=(checkbox.checked ? 'add' :'remove');
            updateSelected(action,id);
        }
        $scope.isSelected=function (id) {
            return $scope.selected.indexOf(id) >= 0;
        }
        $scope.alldelete=function () {
            console.log('将选中的开始修改status：'+$scope.selected);
            var data={
                arr:$scope.selected
            }
           productService.updateAllselect.save(data,function (response) {
               if (coreService.okStatus(response)) {
                   logger.logSuccess("操作成功");
                   $scope.loadPage();
               } else {
                   logger.logError("操作失败");
               }
           }, function(err) {
               logger.logError("系统错误");
           })
        }

contrl:

@RequestMapping(value = "/updateAllselect", method = RequestMethod.POST)
	public @ResponseBody BaseModel<ProductDetailVO> updateAllselect(){
		BaseModel<ProductDetailVO> res = new BaseModel<>();
		JSONObject param = this.convertRequestBody();
		JSONArray arrays=param.getJSONArray("arr");
		List list=new ArrayList();
		for (int i=0;i<arrays.size();i++){
			list.add(arrays.get(i));
		}
		productService.updateAllselect(list);
		return res;
	}

流程：界面上将选中的数据id传到js中，存入到一个jsonArray中，然后在点击修改的时候触发函数将集合传递到controller层中，将JSONaArray转换成ArrayList,获取需要修改的ID，Service层不再介绍。

由于对于前端的知识不太足够，目前是初步的简单实现，但是感觉代码有些不太好，后面会继续优化。