Question

Fiddle.

Here I have a table, In this add button is there, each time radio button will be added, When I click on clear button then the selected radio button should be unselected.

$scope.Clear = function() {
  radiobtn = document.getElementById("theid");
  radiobtn.checked = false;  
};

Answer 1

There are several issues with your code

You are missing ng-click in your clear button which should have ng-click="Clear()"
You cannot have ng-id = "theid" as the radio buttons are dynamically created and it is not a good practice to have same id value for multiple elements
You can then use JQuery to reset the marked radio buttons in that group but when you use ng-model to get the value of the radio buttons i would suggest to use ng-model to reset the radio button values.

var app = angular.module('angularjs-starter', []);

  app.controller('MainCtrl', function($scope) {
  
  $scope.names = ['Mobile','Office','Home'];

  $scope.choices = [{id: 'choice1'}];
  
  $scope.addNewChoice = function() {
    var newItemNo = $scope.choices.length+1;
    $scope.choices.push({'id':'choice'+newItemNo});
  };
  
  
  $scope.Clear = function() {
    $('input[type="radio"]').attr('checked', false);
  };  
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="angularjs-starter" ng-controller="MainCtrl">
   <fieldset ng-model='y' ng-repeat="choice in choices">
      <select>
         <option ng-model='x1' ng-repeat = "x in names">{{x}}</option>
      </select>
      <input value="aa" type="radio" name="na"/>
   </fieldset>
   <button class="addfields" ng-click="addNewChoice()">Add fields</button>
    <button class="addfields" ng-click="Clear()">Clear</button>
</div>

How to remove radio button selected off

1 个答案: