Can not select multiple radio button using Angular.js

Question

I have one problem.I can not select multiple radio button using Angular.js.I am explaining my code below.

<div class="input-group bmargindiv1 col-md-12">
     <label class="checkbox-inline">
     <input type="radio" name="favoriteColors" ng-model="discountPrice" value="true" ng-click="disInclusive();">Discount inclusive
     </label>
     <label class="checkbox-inline">
     <input type="radio" name="favoriteColors" ng-model="discountPrice" value="false" ng-click="disInclusive();">Discount Exclusive
     </label>
 </div>
<div class="input-group bmargindiv1 col-md-12" ng-show="billdata.uncp.$valid && billdata.discount.$valid && billdata.unsp.$valid && billdata.ulsp.$valid && billdata.quantity.$valid && billdata.prcode.$valid">
  <input type="radio" name="favoriteColors" ng-model="isChecked" value="true" ng-required="!isChecked">Add new stock
  <input type="radio" name="favoriteColors" ng-model="isChecked" value="false" ng-required="!isChecked">Update stock 
</div>

My controller side code is given below.

$scope.disInclusive=function(){
        //console.log('hii',$scope.unit_sale_price==null,$scope.discount==null);
        if(($scope.unit_sale_price != '' && $scope.unit_sale_price !=null)  && ($scope.discount !='' && $scope.discount !=null)){
            //console.log('hello');
            if($scope.discountPrice=='false'){
                var price=(parseInt($scope.discount)/100)*(parseInt($scope.unit_sale_price));
                $scope.latest_sale_price=parseInt($scope.unit_sale_price)-price;
            }
            if($scope.discountPrice=='true'){
                $scope.latest_sale_price=$scope.unit_sale_price;
            }
        }else{
            //console.log('hii else');
            if($scope.discount =='' || $scope.discount ==null){
                alert('Please add the discount');
                return;
            }
            if($scope.unit_sale_price =='' || $scope.unit_sale_price ==null){
                alert('Please add the unit sale price');
                return;
            }
        }
    }

Here i have 2 set of radio buttons.I need to select one of each.Here my problem is suppose i selected one radio button from 1st set and when i am selecting second radio button from second set the first one is disappearing.Here i need to select one of each set.Please help me.

Can you please post also your controller? One quick note: you have set the model isChecked to be true or false and it will always display a required error if you have selected the second option — Nora
– Nora, Commented Jan 2, 2016 at 11:03
@Nora : i have declared one click event function in controller side for the radio button and that posted above.Please check. — satya
– satya, Commented Jan 2, 2016 at 11:07

Arkantos · Accepted Answer · 2016-01-02 11:22:28Z

You used the same name favoriteColors for all the radio buttons in both the groups. You should use a different name for the radio buttons in second group

    <div class="input-group bmargindiv1 col-md-12">
     <label for="discount1" class="checkbox-inline"> Discount inclusive </label>
     <input type="radio" id="discount1" name="discounts" 
            ng-model="discountPrice" ng-value="true" 
            ng-click="disInclusive();">

     <label for="discount2" class="checkbox-inline"> Discount Exclusive </label>
     <input type="radio" id="discount2" name="discounts" 
            ng-model="discountPrice" ng-value="false" 
            ng-click="disInclusive();">
   </div>

  <div class="input-group bmargindiv1 col-md-12">
    <input type="radio" name="stocks" ng-model="isChecked" 
           ng-value="true" ng-required="!isChecked">Add new stock
    <input type="radio" name="stocks" ng-model="isChecked" 
           ng-value="false" ng-required="!isChecked">Update stock 
  </div>

Collectives™ on Stack Overflow

Can not select multiple radio button using Angular.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related