How to get radio button checked in AngularJS?

Question

I'm stuck with something supposed simple: get the id of the checked radio button to give it to a function.

Please look at the code bellow:

In HTML :

<ul>
    <div ng-repeat="r in rewards">
        <li>
          <div class="radio">
              <input name="fakeform" type="radio" ng-value="r.id" ng-model="theId" />
              <label for="radio">{{r.name}}</label>
          </div>
        </li>
    </div>
</ul>

...

<button ng-click="use_reward(theId)">
OK
</button>

In controller.js

$scope.use_reward = function(reward_id){
      alert(reward_id);

The alert box returns undefined instead of the id when the function is called.

Thanks for help.

a better oliver · Accepted Answer · 2014-04-18 17:29:55Z

1

<input type="radio" ng-value="r.id" ng-model="$parent.theId" />

<button ng-click="use_reward(theId)">
OK
</button>

Or just use $scope.theId within use_reward.

To get name and id pass the whole object:

<input type="radio" ng-value="r" ng-model="$parent.theReward" />

<button ng-click="use_reward(theReward)">

$scope.use_reward = function(reward){
  alert(reward.id);
  alert(reward.name);

edited Apr 18, 2014 at 17:29

answered Apr 18, 2014 at 15:56

a better oliver

26.9k2 gold badges64 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

David Dahan Over a year ago

Thanks. However, it still doesn't work. I updated my question with the updated code. Thx.

a better oliver Over a year ago

@DavidW. My mistake. I've updated the answer. BTW: You should keep the original question, so that others with the same problem know how to solve it.

David Dahan Over a year ago

That works thanks a lot. Bonus question: would you know how to retrieve r.id AND r.name to call use_reward(theId, theName)?

a better oliver Over a year ago

@DavidW. Pass the whole object. See the updated answer.

Collectives™ on Stack Overflow

How to get radio button checked in AngularJS?

1 Answer 1

4 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Related