current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise
up vote 1 down vote favorite
2
 
<div ng-repeat="x in spaceutilization">
  <input type="checkbox" name="{{x.filenumber}}" id="{{x.id}}" class = "pdffiles" value="101SP{{x.initials}}.dwg" /><label for="{{x.id}}"><button type = "button" class = "btn btn-primary btn-sm hidden-sm hidden-xs"> PDF</button></label><br />
</div>

I need to be able to add something to this snippet that disables the input checkbox based on another AngularJS input such as {{x.status}}. I tried simply doing:

<input type="checkbox" name="{{x.filenumber}}" id="{{x.id}}" class = "pdffiles" value="101SP{{x.initials}}.dwg" {{x.status}} />

Where status:'disabled' but that gave an output of

{{x.status}}=""

within the input element...which I don't understand why at all. But it seemed like the simplest route.

share|improve this question
1  
You can't add attributes dynamically using Interpolation method to your html tag. In your case you can simply do ng-disabled="x.status" – rahilwazir Mar 30 '15 at 21:20
up vote 3 down vote accepted

You need to use ng-disabled="expression" directive, on basic of expression evaluation value it add disabled attribute to that element.Also for better attribute values evaluation you could use ng-attr directive

Markup

<input type="checkbox" ng-attr-name="{{x.filenumber}}" ng-attr-id="{{x.id}}" class ="pdffiles" 
value="101SP{{x.initials}}.dwg" ng-disabled="x.status == 'disabled'"/>

If x.status does written a bool value then you could directly used ng-disabled="{{x.status}}"

share|improve this answer
    
do you mean {{x.status}} == 'disabled' ? Also, what would status equal? What if I don't what the checkbox disabled? – Christine268 Mar 30 '15 at 21:31
    
Using @Rahil Wazir's comment above, I did ng-disabled="{{x.status}}" where status:'true' or status:'false" – Christine268 Mar 30 '15 at 21:39
    
@Christine268 hey don't use interpolation with ng-disabled directive, ng-disabled directive is matured enough to evaluate scope variables, It must be ng-disabled="x.status" if x.status has boolean – Pankaj Parkar Mar 30 '15 at 21:44
    
@pankajparker when I change it to ng-disabled="x.status" it no longer works. status either equals true or false. ng-disabled="{{x.status}}" is what's working for me. – Christine268 Mar 30 '15 at 21:48
    
@Christine268 I updated answer, Now you can do upvote & accept it Thanks :) – Pankaj Parkar Mar 30 '15 at 22:10

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.