I'm currently working on disabling a pair of radio buttons in my AngularJS application when a button is clicked. Below is the code snippet for the radio buttons:
<div class="col-xs-4 btn-group" id="challenge-radio-btn">
<label class="radio-inline">
<input type="radio" ng-model="trigger" ng-value=false
name="{{path.id}} notChallengeTriggr"
ng-change = "onChange(x,y,z,w,a)"
ng-disabled="campaign.editnotscheduled || ischallengeTrigger"
checked> No
</label>
<label class="radio-inline">
<input type="radio" ng-model="trigger" ng-value=true
name="{{path.id}} challengeTriggr"
ng-change = "onChange(x,y,z,w,a)"
ng-disabled="campaign.editnotscheduled || ischallengeTrigger"> Yes
</label>
</div>
Upon clicking the button, I have attempted to print the expression value being evaluated inside the ng-disabled attribute. Despite the value being set to true (as per my JavaScript code), the radio buttons do not become disabled.
After debugging, I discovered a specific scenario where this feature was not functioning properly. Upon selecting a particular dropdown option in the application and then returning to check if the radio buttons were disabled by clicking an edit button, I realized that they remained enabled even though the ng-disabled expression evaluated to true.