Установите хотя бы один флажок при выборе флажка - AngularJS

Question

Установите хотя бы один флажок при выборе флажка - AngularJS

0

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

<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.

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

sravs17991 08 июнь 2016, в 22:16

Источник

0

очисти свой код
jack.the.ripper 08 июнь 2016, в 20:12
0

убрал это. Флажок Atleast on должен быть установлен в обоих случаях, чтобы активировать кнопку отправки.
sravs17991 08 июнь 2016, в 20:22

Теги:

jquery

angularjs

1 ответ

Ещё вопросы

убрал это. Флажок Atleast on должен быть установлен в обоих случаях, чтобы активировать кнопку отправки.

mhodges · Answer 1 · 2016-06-08T18-48-00.000Z

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

Здесь рабочая демонстрация

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

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