ksernow ksernow - 9 months ago 44
AngularJS Question

Make checkbox not clickable in Angular

I have a checkbox which I want to make not clickable. But it also has ng-click function attached. How to do this ?

<input id="record-2" type="checkbox" class="checkbox" ng-click="doIfChecked()">


I tried adding ng-readonly, ng-disabled but it did not work. I added css pointer-events: none but it did not work. I want this checkbox to be not clickable on boolean true/false expression. any idea?

Answer Source

Here is a working sinppet

var app = angular.module("myApp", [])

app.controller("mainController", ["$scope", function($scope){
    $scope.someFlag=false;
    $scope.doIfChecked= function(){
       $scope.someFlag=true;
   }
}]);
select{
width:50%;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">


 <input id="record-2" ng-controller="mainController"  type="checkbox"   ng-controller="mainController" class="checkbox" ng-disabled="someFlag" ng-click="doIfChecked()">
</body>