首页 养生问答 疾病百科 养生资讯 女性养生 男性养生

angularJS怎么校验checkbox必须选中一个,换句话说就是怎么校验checkbox...

发布网友 发布时间:2022-04-26 09:42

我来回答

1个回答

热心网友 时间:2022-04-22 17:21

试试这个例子:
<!DOCTYPE html>
<html ng-app="test">
<head>
    <title>checked</title>
</head>
<body ng-controller="chkCtrl">

    <input type="checkbox" ng-model="m1">1<br/>
    <input type="checkbox" ng-model="m2">2<br/>
    <input type="checkbox" ng-model="m3">3<br/>
    <input type="checkbox" ng-model="m4">4<br/>

    <button ng-click="sub()">提交</button>

    <script type="text/javascript" src="./angular.min.js"></script>
    <script>
        var app = angular.mole('test', []);

        app.controller('chkCtrl', function($scope){

            $scope.sub = function(){

                //m1到m4之间只要有一个选中 mode就是true
                if($scope.m1 || $scope.m2 || $scope.m3 || $scope.m4){
                    alert('可以提交')
                }
            };
        });
    </script>
</body>
</html>

追问谢谢你的回答,这个checkbox是ng-repeat指令后台动态取的,数量不确定,一般也会很多,这样不好没个都判断一下

追答试试这种思路:
watch checkbox的值是否改变
<body ng-controller="chkCtrl">
    <div ng-repeat="item in chkList"><input type="checkbox" ng-model="item.checked">1</div>
    <button ng-click="sub()">提交</button>
    <script type="text/javascript" src="./angular.min.js"></script>
    <script>
        var app = angular.mole('test', []);
        app.controller('chkCtrl', function($scope){
            $scope.chkList = [
                {id:1, checked: false},
                {id:2, checked: false},
                {id:3, checked: false},
                {id:4, checked: false}
            ];
            var flag = false;
            $scope.$watch('chkList', function(newValue, oldValue) {
                if(newValue !== oldValue){
                    flag = true;
                }
            }, true);
            $scope.sub = function(){
                if(flag){
                    alert('可以提交了')
                }
            };
        });
    </script>
</body>
</html>

声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com