Skip to content

Instantly share code, notes, and snippets.

@mpdaugherty

mpdaugherty/right_radios.html

Created July 7, 2012 06:23
Show Gist options
  • Star 9 You must be signed in to star a gist
  • Fork 5 You must be signed in to fork a gist
  • Save mpdaugherty/3065072 to your computer and use it in GitHub Desktop.
Save mpdaugherty/3065072 to your computer and use it in GitHub Desktop.
Download ZIP
Example of how to correctly use radio inputs with Angular JS's ng:Repeat directive
Raw
right_radios.html
<div ng-repeat="m in milestone_choices" class="row-fluid">
<label><input type="radio" name="meaningless" value="(( $index ))" ng-model="milestone_data.index" />
&nbsp;<span ng-bind="m.title"></span></label>
</div>
Raw
right_radios.js
$scope.milestone_data = { index: 0 };
Raw
select.html
<input name="milestone" type="hidden" value="(( repo.name + '--milestone--' + milestone.number ))"/>
<select ng-show="milestone_choices.length"
ng-model="milestone" ng-options="m.title for m in milestone_choices">
</select>
Raw
wrong_radios.html
<div ng-repeat="milestone in milestone_choices" class="row-fluid">
<input type="radio" ng-model="milestone" name="milestone" value="(( repo.name + '--milestone--' + milestone.number ))" ng-model="milestone"/>
&nbsp;<span ng-bind="milestone.title"></span>
</div>
@sciotta
Copy link

sciotta commented Feb 4, 2014

You can use ng-value instead value on input radio attribute, it's better and clean. :)

@ernestopye
Copy link

The name attribute for radio buttons isn't meaningless. If you have multiple radio button lists they won't group properly, will they? I had to bind a unique group value to mine to get them to work.

@klebergraciasoares
Copy link

Top

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment