Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!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.3.8/angular.min.js"></script>
</head>
<body ng-app="checkboxExample">
  <script>
  angular.module('checkboxExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.group = {
        val1: 1,
        val2: 0,
        val3: 0,
        val4: 0,
      };
      $scope.toggle = false;
      $scope.change = function() {
        angular.forEach($scope.group, function(v, k){
          $scope.group[k] = $scope.toggle ? 1 : 0;
        });
      };
    }]);
</script>
<form name="myForm" ng-controller="ExampleController">
  <input type="checkbox" id="all" ng-model="toggle" ng-change="change()"><label for="all">выделить все</label>
  
  <input type="checkbox" class="block" ng-checked="group.val1" id="test1"><label for="test1">test1</label>
  <input type="checkbox" class="block" ng-checked="group.val2" id="test2"><label for="test2">test2</label>
  <input type="checkbox" class="block" ng-checked="group.val3" id="test3"><label for="test3">test3</label>
  <input type="checkbox" class="block" ng-checked="group.val4" id="test4"><label for="test4">test4</label>
 </form>
</body>
</html>
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers