Question

我想在勾选复选框后禁用整个班级。

我有2个选项＆＃34;现在升级＆＃34;并且＆＃34;稍后升级＆＃34;。

如果我稍后检查升级，我会选择时间选择器来安排时间。

如果我现在检查升级，则应禁用计划选择器。

如何禁用全班？

下面的代码用于复选框：

<div class="vcenter-domain-column">
                                    <div class="checkbox vcenter-domain-chkboxbtn">
                                        <input type="checkbox" id="vcenter-1" name="vcenter-1" value="1">
                                    </div>
                                    <!--<img class="vcenter-domain-pic" src="img/cloud-icon.png">-->
                                    <div class="vcenter-domain-label">
                                        <label for="vcenter-1">Upgrade Now</label>
                                    </div>
                                </div>
                                <div class="vcenter-domain-column">
                                    <div class="checkbox vcenter-domain-chkboxbtn checked">
                                        <input type="checkbox" id="vcenter-2" name="vcenter-2" value="1">
                                    </div>
                                    <!--<img class="vcenter-domain-pic" src="img/cloud-icon.png">-->
                                    <div class="vcenter-domain-label">
                                        <label for="vcenter-2">Upgrade Later</label>
                                    </div>
                                </div>

下面的代码是时间选择器：

<div class="update-schedule-section">
                        <p>Update schedule for all selected</p>
                        <div class="update-datepicker-section">
                            <div class="datepicker-box">
                                <span>date</span>
                                <input class="date-picker form-control" ng-click="open($event)" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" type="text">
                            </div>
                            <div class="datepicker-box">
                                <span>Time</span>
                                <input class="time-picker" type="text" name="" value="10:00 PM">
                            </div>
                            <div class="datepicker-box">
                                <span>expected completion</span>
                                <span class="expected-date">Tuesday, Oct 7, 2014 - 2:00 AM</span>
                            </div>
                        </div>
                    </div>

Answer 1

请参阅以下代码，

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-checkbox-input-directive-production</title>


  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.1/angular.min.js"></script>



</head>
<body ng-app="checkboxExample">
  <script>
  angular.module('checkboxExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.value1 = false;
      $scope.value2 = false;
    }]);
</script>
<form name="myForm" ng-controller="ExampleController">
  Upgrade Now: <input type="checkbox" ng-model="value1"> <br/>
  Upgrade Later: <input type="checkbox" ng-model="value2"> <br/>
  <div ng-show="value2 && !value1">Time picker</div>
 </form>
</body>
</html>

这将为您提供适当的输出。

我选中复选框后要禁用整个班级

1 个答案: