Проверьте по крайней мере один флажок при выборе флажка - AngularJS

Question

У меня есть две флажки на моей странице. При первом выборе флажка будет отображаться список флажков. Проверьте, по крайней мере, один из них, чтобы получить кнопку отправки включен

<div class="row"> 
    <div class="col-md-2"> 
     <label><input type="checkbox" ng-model="CheckAllTrials" />&nbsp;Check All</label> 
    </div> 
    <div class="col-md-5"> 
     <input type="text" ng-model="searchByTrialNumber" class="form-control" placeholder="search trial number"> 
    </div> 
    <div class="row"> 
     <div class="col-md-12"> 
      <label class="normal"> 
       <input type="checkbox" ng-model="chkOncore" id="chkOncore" ng-required="isOptionsRequired()" /> 
       ONCORE 
      </label> 
     </div> 
    </div> 
    <div class="row" ng-show="chkOncore" id="divOnCore" style="background-color:#eee;border:1px dotted #ccc;margin:2px;padding:4px;"> 
     <div class="row"> 
      <div class="col-md-12 "> 
       <label>Check CTO Managed Trials/Protocols</label> 
       <div class="row"> 
        <div class="col-md-2"> 
         <label><input type="checkbox" ng-model="CheckAllTrials" />&nbsp;Check All</label> 
         <div class="row"> 
          <div class="col-md-2"> 
           <label><input type="checkbox" ng-model="CheckAllTrials" />&nbsp;Check All</label> 
          </div> 
          <div class="col-md-5"> 
           <input type="text" ng-model="searchByTrialNumber" class="form-control" placeholder="search trial number"> 
           <div class="col-md-5"> 
            <input type="text" ng-model="searchByTrialName" class="form-control" placeholder="search trial title"> 
           </div> 
          </div> 
          <div class="well" style="max-height:400px;overflow-y:auto;"> 
           <div ng-repeat="item in oncoreTrials|filter:{protocol_nbr:searchByTrialNumber,protocol_long_title:searchByTrialName}"> 
            <label class="normal"> 
             <input type="checkbox" ng-click="UpdateOncoreTrials(item.protocol_nbr)" value="{{item.protocol_nbr}}" ng-checked="CheckAllTrials">[{{item.protocol_nbr}}]-{{item.protocol_long_title}}</label> 
           </div> 
          </div> 
         </div> 
        </div> 
        <div class="row"> 
         <div class="col-md-12 "> 
          <label>Check CTO Management Groups</label> 
          <div class="well" style="max-height:400px;overflow-y:auto;"> 
           <div class="row"> 
            <div class="col-md-2"> 
             <label><input type="checkbox" ng-model="CheckAllGroups" />&nbsp;Check All</label> 
            </div> 
            <div class="col-md-10"> 
             <input type="text" ng-model="searchByGroupName" class="form-control" placeholder="search group"> 
            </div> 
           </div> 
           <div ng-repeat="item in oncoreGroups|filter:{name:searchByGroupName}"> 
            <label class="normal"> 
             <input type="checkbox" ng-click="UpdateOncoreGroups(item.name)" value="{{item.name}}" ng-checked="CheckAllGroups"> {{item.name}} 
            </label> 
           </div> 
          </div> 
         </div> 
        </div> 
        <div class="row"> 
         <div class="col-md-12 "> 
          <label style="font-weight:normal;">Please write the role/access types you want to apply for, the admin will contact you for further information:</label> 
          <textarea ng-model="oncoreRoles" class="form-control"></textarea> 
         </div> 
        </div> 
       </div> 
       <br /> 
       <div class="row"> 
        <div class="col-md-12"> 
         <input type="checkbox" ng-model="chkBMT" id="chkBMT" ng-click="CheckApplication('BMT')" /> 
         <label for="chkBMT" class="normal">BMT 1.0</label> 
        </div> 
       </div> 
       <div id="divBMT" class="row" ng-show="chkBMT"> 
        <div class="col-md-12"> 
         <label>Request Access Role:</label> 
         <select ng-model="BMT_AccessRole" ng-required="chkBMT"> 
          <option value="Administrator">Administrator</option> 
          <option value="User">User</option> 
         </select> 
        </div> 
       </div> 

       <button class="btn btn-primary btn-active" ng-disabled="!frmRequest.$valid||!r.DataUseAgreement||(!chkBMT&&!chkOncore)" ng-click="SaveData()"><i class="fa fa-save"></i> Submit</button> 

Теперь кнопка отправить становится включен, даже если я не выбрать один флажок в oncoreTrials.

Я хочу отключить кнопку отправки, если пользователь выбирает oncore и не выбирает флажок oncoreTrials и oncoreGroups.

Пожалуйста, помогите мне. Заранее спасибо

Answer 1

Это не совсем подключи и играй прямо в свой код, но идея здесь для вас. Привяжите атрибут ng-disabled к оценке функции. Внутри своей функции вы можете посмотреть свои флажки и определить, проверены ли они. Это будет работать для одной группы флажков, но вы, очевидно, можете добавить больше логики к своей функции anyChecked(), которая вам нужна. Надеюсь это поможет!

Вот working demo

<button ng-disabled="anyChecked()">Submit</button> 

$scope.anyChecked = function() { 
    return !$scope.childCheckboxes.some(function (checkbox, index){ 
     return checkbox.checked; 
    }); 
};