Reputation: 164
Got a problem, here the situation:
I want to uncheck the first checkbox when I uncheck the second checkbox.
Let say, by default both checkbox are checked. When I click second checkbox, I want the first checkbox to uncheck also.
HTML:
<ion-checkbox ng-model="firstCheckbox">First Checkbox</ion-checkbox>
<ion-checkbox ng-model="secondCheckbox" ng-change="uncheckFirstCheckbox(secondCheckbox)">Second Checkbox</ion-checkbox>
JS:
$scope.uncheckFirstCheckbox = function(secondCheckbox) {
if(secondCheckbox.checked === false) {
$scope.firstCheckbox = false;
};
};
The $scope.firstCheckbox
turn false but it remain uncheck in HTML.
May I know where could be the problem?
Upvotes: 1
Views: 1858
Reputation: 14976
You're trying to access secondCheckbox.checked
property but secondCheckbox
is already false
. You should be only checking secondCheckbox
for a false
value. Use if(!secondCheckbox)
instead for the condition.
Here is a working fiddle of your code.
HTML
<ion-checkbox ng-model="firstCheckbox">First Checkbox</ion-checkbox>
<ion-checkbox ng-model="secondCheckbox" ng-change="uncheckFirstCheckbox(secondCheckbox)">Second Checkbox</ion-checkbox>
JS
$scope.uncheckFirstCheckbox = function(secondCheckbox) {
if (!secondCheckbox) {
$scope.firstCheckbox = false;
};
};
Upvotes: 2