Not getting values of radiobutton using angularJS

Question

I want to set values of checked radiobutton in a variable. But I am unable to get it. Below is the code what I tried

master.controller('FiberLead_Filter', function($scope, $http, NEIQC_Service, Scopes, $rootScope) {
      var rdSelectMP = $scope.MPSelect; // here I am getting undefined
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.25/angular.min.js"></script>
<div class="rightFilter" ng-controller="FiberLead_Filter as Filter" id="FiberLead_Filter">
  <div class="pdfDownload customeRadioWrap">
    <div class="customeRadio">
      <input type="radio" id="btnCurrentMP" name="radio-group" ng-model="MPSelect" ng-value="Current">
      <label for="btnCurrentMP">Current MP</label>
    </div>
    <div class="customeRadio">
      <input type="radio" id="btnAllMP" name="radio-group" ng-model="MPSelect" ng-value="All">
      <label for="btnAllMP">All MP</label>
    </div>
    <button class="btn btn-default customBtn" ng-click="DownloadExcelReport()"><i class="fa fa-file-pdf-o" aria-hidden="true"></i> Download</button>
  </div>
</div>

Let me know what is wrong with my code as I am getting it UNDEFINED

briosheje · Accepted Answer · 2019-04-12 10:36:31Z

2

This is because ng-value is looking for the "All" $scope variable, but there likely is none. If the expected value is a string, either use 'All' or, instead, just use value.

Working fiddle below, click the "download" button to log the current value (select a value first).

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

angular.module('app').controller('FiberLead_Filter', function($scope, $http, $rootScope) {
      $scope.DownloadExcelReport = function(){
        console.log($scope.MPSelect);
      }
    }
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.25/angular.min.js"></script>
<div ng-app="app">
  <div class="rightFilter" ng-controller="FiberLead_Filter as Filter" id="FiberLead_Filter">
    <div class="pdfDownload customeRadioWrap">
      <div class="customeRadio">
        <input type="radio" id="btnCurrentMP" name="radio-group" ng-model="MPSelect" value="Current">
        <label for="btnCurrentMP">Current MP</label>
      </div>
      <div class="customeRadio">
        <input type="radio" id="btnAllMP" name="radio-group" ng-model="MPSelect" value="All">
        <label for="btnAllMP">All MP</label>
      </div>
      <button class="btn btn-default customBtn" ng-click="DownloadExcelReport()"><i class="fa fa-file-pdf-o" aria-hidden="true"></i> Download</button>
    </div>
  </div>
</div>

answered Apr 12, 2019 at 10:36

briosheje

7,4662 gold badges35 silver badges56 bronze badges

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

2 Comments

HEEN Over a year ago

perfect mate, it worked.I was just missing the value attirbute I guess. I was thinking of doing something like ng-click and get the current value

briosheje Over a year ago

it's just that ng-value, like ng-click, takes an expression. In that case, ng-value looks for $scope property, so it won't work as expected if you simply need to bind a string.

Collectives™ on Stack Overflow

Not getting values of radiobutton using angularJS

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related