4

I have a dropdown list in a repeater that should toggle my custom "required" attribute. I tried ng-show but the display="none" attribute is all that was added. My options are:-

1- Add/remove the input field and set bird.Stuff, not just hide it because it is still required.

2- Add/remove 'required' attribute on the input field.

js

$scope.validateParticipants = function (type) {
    if (type == "Single") {
        this.donation.Participants = "1";
    }
    else
        this.donation.Participants = "";
}

html

 <div ng-repeat="bird in animalTest.birds">
    @(Html.DropDownList("Type", (IEnumerable<SelectListItem>)ViewBag.BirdList, new { ng_model = "bird.Type", ng_change = "validateRequired(bird.Type)", required = "Type is required" }))
    ...
    <input data-ng-show="bird.Type == 'Endangered'" id="stuff" type="number" data-ng-model="bird.Stuff" required = "Number of Volunteers required"/>  
</div>

Thanks for the help in advance!

MrM
  • 21,709
  • 30
  • 113
  • 139

1 Answers1

9

Use ng-required. This takes an angular expression and adds the required attribute if the expression is true.

<input type="number" data-ng-model="bird.Stuff" ng-required="donation.Participants > 0"/>
Gruff Bunny
  • 27,738
  • 10
  • 72
  • 59
  • Hi @GruffBunny, I have a situation when ng-required adds required attribute and doesn't remove it after ng-required value changed. Do you have any minds – Gleb Aug 27 '15 at 21:36
  • 1
    Without seeing any code it's not easy to diagnose the problem. My gut feel is that the change is made but angular doesn't know about it (check out angular $apply). You're best way of getting an answer is to ask a new question and include code showing the problem. – Gruff Bunny Aug 28 '15 at 08:23
  • 1
    thanks, for the answer. The mistake was in my code (I wrote ng-required="{{!user.id}}" - the problem was in braces) – Gleb Aug 28 '15 at 10:57