Search code examples
javascriptangularjsangularjs-ng-repeatradio-groupangular-ngmodel

Radio group selected option not updating ngModel value in angular


I am new to angularjs and trying to find a solution for the setting a selected value of radio group to the ngmodel.

//my.html     

<div ng-controller='controller'> 
 <div class="btn-group" ng-model="option" ng-repeat="arr in dragDropOption">
  <input type="radio" name="optionCorrectOpt" data-ng-model="option" 
    value="{{dragDropOption[$index].text}}">
      {{dragDropOption[$index].text}}
</div>

and //mycontroller.js

 app = angular.module('app', []);

 app.controller('controller', function ($scope) {
 $scope.dragDropOption = [];
 $scope.option = "not set";

 $scope.dragDropOption = [{
     text: "analog"
 }, {
     text: "isdn"
 }, {
     text: "dsl"
 }];
 //   $scope.option = $scope.dragDropOption[0].text;
});

My fiddle is here!

Might be it is repeated question, please help me with sharing already answerd stackoverflow question's link or new answer. Thanks in advance.


Solution

  • For input change

    data-ng-model="option"
    

    to:

    data-ng-model="$parent.option"
    

    Demo Fiddle