how to get selected value from radio button from html in angular Js

Question

i try to get selected value from radio button But when i choose teacher it still be s "student"

Html File :

 <!DOCTYPE html> <html ng-app="phase2"> <head> <title>Sign UP Page</title> <script>document.write('<base href="' + document.location + '" />');</script> <link href="style.css" rel="stylesheet" /> <script data-semver="1.2.28" src="https://code.angularjs.org/1.2.28/angular.js" data-require="angular.js@1.2.x"></script> <script src="https://code.angularjs.org/1.2.28/angular-route.js"></script> <script src="RigesterationController.js"></script> </head> <body > <center> <p>Enter Your User Name : <input type="text" , name="UserName" id ="UName" required /> </p> <p>Enter Your Email : <input type="text" , name="Email" id ="email" required /> </p> <p>Enter Your Password : <input type="password" , name="pass" id ="Pass" required/> </p> <p>Choose Gender : <br> Male<input type="radio" name="gender" value="m" id="Gender" checked/> Female<input type="radio" name="gender" value="f" id="Gender"/> </p> <p>Choose User Type :<br> Student<input type="radio" name="UserType" value="s" id="Utype" checked/> Teacher<input type="radio" name="UserType" value="t" id="Utype"/> </p> <div ng-app="phase2" > <div ng-controller="SignUP"> <input type="button" name="signup" value="SignUP" ng-click="save()" /> </div> </div> </center> </body> </html>

RigesterationController.js File :

 var app = angular.module("phase2" , []) app.controller( "SignUP" ,function ($scope , $http , srvShareData , $location) { $scope.dataToShare = []; $scope.save = function() { var email= document.getElementById("email").value; var UName=document.getElementById("UName").value; var Pass=document.getElementById("Pass").value; var gender=document.getElementById("Gender").value; var UserType=document.getElementById("Utype").value; alert(UserType) $http.get('http://localhost:8090/SignUp/'+email+'/'+UName+'/'+Pass+'/'+gender+'/'+UserType) .then(function(response) { }); if (UserType=="t") { window.location.href="http://localhost:8060/TheAngular_Project/TeacherPage.html"; } else if (UserType=="s") { window.location.href="http://localhost:8060/TheAngular_Project/StudentPage.html"; } } });

i get always s although I choose teacher .. how to get selected value ? thanks in advance

Answer 1

Some suggestions :

Why ng-app="phase2" two times ?
- The ng-app directive is used to auto-bootstrap an AngularJS application. And according to AngularJS Documentation, only one AngularJS application can be auto-bootstrapped per HTML document.
Why ng-controller directive only on submit button as form fields(input elements) also the part of the form ?
- it should come on the parent element.
Why plain Javascript to get the form data as you can use ng-model or other angular directives to communicate between the controller and view ?
- You can pass form data using ng-model into the controller as it is very popular and powerful feature in AngularJS instead of doing in a wrong way.

DEMO

 var myApp = angular.module('phase2',[]); myApp.controller('SignUP', function($scope) { $scope.save = function(selectedUser) { alert(selectedUser); }; });

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="phase2" ng-controller="SignUP"> <form name="myForm" ng-submit="save(uType)"> <p>Choose User Type :<br>Student<input type="radio" name="UserType" value="s" ng-model="uType"/>Teacher<input type="radio" name="UserType" value="t" ng-model="uType"/></p> <input type="submit" name="signup" value="SignUP"/> </form> </div>

how to get selected value from radio button from html in angular Js

Question

1 answers

solution1
1 ACCPTED 2017-04-15 20:04:30

how to get selected value from radio button from html in angular Js

Question

1 answers

solution1 1 ACCPTED 2017-04-15 20:04:30

solution1
1 ACCPTED 2017-04-15 20:04:30