Java, .NET, PHP, PYTHON, ANGULAR, .NET, ML, Data Scince, Testing, CI Tutorials in Easy Languages.

"Best Software Training, Internship, Project Development center of Indore India, Helpline 780506-3968"

We can implement radio button using two different ways:-


1)  using Array Object


<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body>
  <div ng-app="myapp" ng-controller="myctrl">

    <div ng-repeat="item in arr"><input type="radio" value="{{item}}" name="a" ng-model="$parent.course" />{{item}}

    </div>
    <input type="button" value="Click" ng-click="fun()" />
<br><br>
    {{msg}}
  </div>

  <script type="text/javascript">
 
   var app = angular.module('myapp',[]);
   app.controller('myctrl',function($scope)
   {

      $scope.arr = ["C","CPP","DS","JAVA","PHP","iOS","Android"];
      $scope.fun=function()
      {
        if ($scope.course!=undefined)
          $scope.msg = $scope.course;
         else
          $scope.msg = 'Please choose an option';
      }
   }

    )

  </script>
</body>
</html>


2)  using normal variable

<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="angular.min.js"></script>
</head>
<body>
  <div ng-app="myapp" ng-controller="myctrl">

    <input type="radio" value="C" name="a" ng-model="a" />C
    <br><br>
    <input type="radio" value="CPP" name="a" ng-model="a" />CPP
   <br><br>
    <input type="button" value="Click" ng-click="fun()" />
<br><br>
    {{msg}}
  </div>

  <script type="text/javascript">
 
   var app = angular.module('myapp',[]);
   app.controller('myctrl',function($scope)
   {

 
      $scope.fun=function()
      {
     
          $scope.msg=$scope.a;
       
      }
   }

    )

  </script>
</body>
</html>

Post a Comment

If you have any doubt in programming or join online classes then you can contact us by comment .

Previous Post Next Post