Angularjs Selecting two checkboxes from multiple checkboxes

Question

I need to select only two check boxes from the given multiple checkboxes and are not embedded in the list.

<input type="checkbox" class="two-checkbox" id="curr-EUR" ng-model="reqObject.EUR" ng-click="checkChanged()">EUR</input>
<input type="checkbox" class="two-checkbox" id="curr-JPY" ng-model="reqObject.JPY" ng-click="checkChanged()">JPY</input>
<input type="checkbox" class="two-checkbox" id="curr-INR" ng-model="reqObject.INR" ng-click="checkChanged()">INR</input>
<input type="checkbox" class="two-checkbox" id="curr-USD" ng-model="reqObject.USD" ng-click="checkChanged()">USD</input>

The above are my checkboxes and I need to select only two from them in angular way.

Welcome to Stackoverflow! What have you tried so far? You might want to read How do I ask a good question, which enhances the probability for getting a useful answer drastically. You might find ESR's excellent essay How To Ask Questions The Smart Way helpful, too. — Markus W Mahlberg
– Markus W Mahlberg, Commented Nov 17, 2015 at 11:40

potatopeelings · Accepted Answer · 2015-11-17 11:53:06Z

With HTML

<div ng-app="myApp">
    <div ng-controller="myCtrlr">
        <input type="checkbox" class="two-checkbox" id="curr-EUR" ng-model="reqObject.EUR" ng-click="checkChanged('EUR')">EUR</input>
        <input type="checkbox" class="two-checkbox" id="curr-JPY" ng-model="reqObject.JPY" ng-click="checkChanged('JPY')">JPY</input>
        <input type="checkbox" class="two-checkbox" id="curr-INR" ng-model="reqObject.INR" ng-click="checkChanged('INR')">INR</input>
        <input type="checkbox" class="two-checkbox" id="curr-USD" ng-model="reqObject.USD" ng-click="checkChanged('USD')">USD</input>
    </div>
</div>

the following script should do what you are looking for

angular.module('myApp', [])
    .controller('myCtrlr', function ($scope) {

        var arr = [undefined, undefined];

        $scope.reqObject = {
            EUR   : false,
            JPY   : false,
            INR   : false,
            USD   : false
        }

        $scope.checkChanged = function (v) {
            var key = arr.shift();
            if (key)
                $scope.reqObject[key] = false;

            arr.push(v);
            $scope.reqObject[v] = true;
        }
    })

angular.module('myApp', [])
  .controller('myCtrlr', function($scope) {

    var arr = [undefined, undefined];

    $scope.reqObject = {
      EUR: false,
      JPY: false,
      INR: false,
      USD: false
    }

    $scope.checkChanged = function(v) {
      var key = arr.shift();
      if (key)
        $scope.reqObject[key] = false;

      arr.push(v);
      $scope.reqObject[v] = true;
    }
  })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <div ng-app="myApp">
        <div ng-controller="myCtrlr">
            <input type="checkbox" class="two-checkbox" id="curr-EUR" ng-model="reqObject.EUR" ng-click="checkChanged('EUR')">EUR</input>
            <input type="checkbox" class="two-checkbox" id="curr-JPY" ng-model="reqObject.JPY" ng-click="checkChanged('JPY')">JPY</input>
            <input type="checkbox" class="two-checkbox" id="curr-INR" ng-model="reqObject.INR" ng-click="checkChanged('INR')">INR</input>
            <input type="checkbox" class="two-checkbox" id="curr-USD" ng-model="reqObject.USD" ng-click="checkChanged('USD')">USD</input>
        </div>
    </div>

Collectives™ on Stack Overflow

Angularjs Selecting two checkboxes from multiple checkboxes

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related