AngularJS toggle radio buttons with default selection.

This fork was updated to angular 1.5.0. We changed the mechanism by which the sections are disabled.

by Aaron Calderon

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<div ng-app="miniapp">
  <div ng-controller="Ctrl" class="cont">
    <section>
      <h2>
                <input type="radio" name="something" value="1" ng-model="checkboxSelection"/> Checkbox 1
                <input type="radio" name="something" value="2" ng-model="checkboxSelection"/> Checkbox 2
            </h2>
      <div>
        All inside here should be enabled for Checkbox 1 only
        <br/>
        <input type="button" ng-model="btn3" ng-disabled="checkboxSelection==1" value="btn1" />
        <input type="button" ng-model="btn4" ng-disabled="checkboxSelection==1" value="btn2" />
        <input type="text" ng-model="txt2" ng-disabled="checkboxSelection==1" value="btn2" /> --{{isCheckboxSelected('1')}}--
      </div>
      <div>
        All inside here should be enabled for Checkbox 2 only
        <br/>
        <input type="button" ng-model="btn3" ng-disabled="checkboxSelection==2" value="btn1" />
        <input type="button" ng-model="btn4" ng-disabled="checkboxSelection==2" value="btn2" />
        <input type="text" ng-model="txt2" ng-disabled="checkboxSelection==2" value="btn2" /> --{{isCheckboxSelected('2')}}--
      </div>
    </section>
  </div>
</div>

CSS

.cont div {
  border: 2px solid red;
  margin: 5px;
}

JavaScript

var $scope;
var app = angular.module('miniapp', [])
  .controller('Ctrl', ['$scope',
    function($scope) {
      // Can replace this with: ng-init="checkboxSelection = '1'".
      $scope.checkboxSelection = 1;
  ]);