angularjs实现多选全选前端代码
1<ul class="list checkstyle">
2<li class="item item-checkbox">
3<label class="checkbox checkbox-balanced">
4<input type="checkbox" ng-model="master" ng-click="all(master,tesarry)">
5</label>
6全选
angular和angularjs7</li>
8<li class="item item-checkbox" ng-repeat="z in tesarry">
9<label class="checkbox checkbox-balanced">
10<input id={{z.UserId}} type="checkbox" ng-model="x" ng-checked="master" ng-click="chk(z,x)"> 11</label>
12<img src="#"/>
13<h2>{{z.Name}}</h2>
14</li>
15</ul>
后端代码
$scope.choseArr=[];//定义数组⽤于存放前端显⽰
var str="";//
var flag='';//是否点击了全选,是为a
$scope.x=false;//默认未选中
$scope.all= function (c,v) {//全选
if(c==true){
$scope.x=true;
$scope.choseArr=v;
}else{
$scope.x=false;
$scope.choseArr=[];
}
flag='a';
};
$scope.chk= function (z,x) {//单选或者多选
if(flag=='a') {//在全选的基础上操作
str = $scope.choseArr.join(',') + ',';
}
if (x == true) {//选中
str = str + z.UserId + ',';
} else {
str = place(z.UserId + ',', '');//取消选中
}
$scope.choseArr = (str.substr(0, str.length - 1)).split(',');
};
$scope.delete= function () {// 操作CURD
if($scope.choseArr[0]==""||$scope.choseArr.length==0){//没有选择⼀个的时候提⽰
alert("请⾄少选中⼀条数据在操作!")
return;
};
for(var i=0;i<$scope.choseArr.length;i++){
//alert($scope.choseArr[i]);
console.log($scope.choseArr[i]);//遍历选中的id
}
};
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论