Menu
Can I use ng-readonly directive in a checkbox?
The checkbox is writable even after it is decorated with ng-readonly.
Html:
<input type="checkbox" ng-model="model" ng-readonly="test" /> {{model}}
Controller:
myApp.controller('MyCtrl', function($scope) {
$scope.test = true;
});
Added Fiddle
224
//This will make all read-only check boxes truly read-only $('input[type="checkbox"][readonly]'). on("click. readonly", function(event){event. preventDefault();}).
AngularJS ng-readonly DirectiveThe ng-readonly directive sets the readonly attribute of a form field (input or textarea). The form field will be readonly if the expression inside the ng-readonly attribute returns true. The ng-readonly directive is necessary to be able to shift the value between true and false .
$(':checkbox[readonly]'). click(function(){ return false; });
You can't style a disabled checkbox directly because it's controlled by the browser / OS. However you can be clever and replace the checkbox with a label that simulates a checkbox using pure CSS. You need to have an adjacent label that you can use to style a new "pseudo checkbox".
if you want to disable it use this:
<input type="checkbox" ng-disabled="true" ng-model="test" />
If you like to have it "more" visible, you can always use a little javascript trick:
<input type="checkbox" ng-model="model" onclick="return false;" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
