Angular JS Passing Values of Selected Radio Buttons On Click

Question

In view there are two lists of radio buttons

L1

    <input type="radio" name="SET1" ng-model="SET1Selected" value="S1"> S1
    <input type="radio" name="SET1" ng-model="SET1Selected" value="S2"> S2
    <input type="radio" name="SET1" ng-model="SET1Selected" value="S3"> S3

L2

    <input type="radio" name="SET2" ng-model="SET2Selected" values="S4"> S4
    <input type="radio" name="SET2" ng-model="SET2Selected" value="S5"> S5
    <input type="radio" name="SET2" ng-model="SET2Selected" value="S6"> S6

    <button ng-click="submitRadioBtn()"></button>

Angular JS

    var app = angular.module("myApp", []);
    app.controller("myCtrl", ['$scope', function($scope) {  

     $scope.submitRadioBtn=function(){
       var valfromSET1 = $scope.SET1Selected;
        var valfromSET2 = $scope.SET2Selected; 
     }
    }]);

I have to get values of both radio buttons on click.

your code looks true, because you have 2 different groups seting to 2 different variables — Sal-laS
– Sal-laS, Commented Jan 29, 2017 at 12:32
How about setting an ng-value instead of value? like in here stackoverflow.com/questions/32450288/… — papakias
– papakias, Commented Jan 29, 2017 at 12:37

Sajeetharan · Accepted Answer · 2017-01-29 13:30:06Z

Your code should work without any problem. Just make sure you have included the ng-controller outside both of the div tags.

DEMO

 var app = angular.module("myApp", []);
 app.controller("myCtrl", ['$scope', function($scope) {

   $scope.submitRadioBtn = function() {
     var valfromSET1 = $scope.SET1Selected;
     var valfromSET2 = $scope.SET2Selected;
     console.log(valfromSET1);
     console.log(valfromSET2);
   }
 }]);

<!DOCTYPE html>
<html ng-app="myApp">

<head>
  <meta charset="utf-8" />
  <script src="https://code.angularjs.org/1.4.7/angular.js"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="myCtrl">
  <div class="row">
  <input type="radio" name="SET1" ng-model="SET1Selected" value="S1"> S1
  <input type="radio" name="SET1" ng-model="SET1Selected" value="S2"> S2
  <input type="radio" name="SET1" ng-model="SET1Selected" value="S3"> S3
  </div>
  <div class="row">
  <input type="radio" name="SET2" ng-model="SET2Selected" values="S4"> S4
  <input type="radio" name="SET2" ng-model="SET2Selected" value="S5"> S5
  <input type="radio" name="SET2" ng-model="SET2Selected" value="S6"> S6
  </div>
  <div class="row">
  <button ng-click="submitRadioBtn()">submit</button>
  </div>
</body>

</html>

Collectives™ on Stack Overflow

Angular JS Passing Values of Selected Radio Buttons On Click

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related