CODEWITHSUNDEEP
angularjsionic-framework
Andrew Jerome Bernard
Andrew Jerome Bernard

Reputation: 135

Check one checkbox and uncheck previous checkbox

So, I have two toggle buttons, the user must be able only to select one of the above two toggle buttons as show in the image below:

1

How can I achieve this ?

Upvotes: 2

Views: 611

Answers (1)

PRANSHU MIDHA
PRANSHU MIDHA

Reputation: 472

You can use Radio buttons : http://ionicframework.com/docs/v1/components/#radio-buttons

But if you want to use toggle button and achieve this thing, you can use $watch : Documentation

Ionic code:

 <label class="toggle">Bride only
     <input type="checkbox" ng-model="B">
     <div class="track">
         <div class="handle"></div>
     </div>
 </label>

<br>

 <label class="toggle">Bride & Bridesmaids
     <input type="checkbox" ng-model="B&B">
     <div class="track">
         <div class="handle"></div>
     </div>
 </label>

Angular code:

$scope.B=false; // for Bride only
$scope.B&b= false //for Bride and Bridesmaids

$scope.$watch('B',function(){

  if($scope.B==true){
    $scope.B&B=false;
    console.log($scope.B&B);
  }

}); 

$scope.$watch('B&B',function(){

  if($scope.B&B==true){
    $scope.B=false;
    console.log($scope.B);
  }

});

Hope this helps.

Upvotes: 1

Related Questions