Search code examples
javascriptangularjsangularjs-scope

How do you get value of form using angular javascript?


been trying to get the value of form using angular js on form submit. someone help me what to do. I am new to angular JS.

<div id="content" ng-app="TryApp" ng-controller="AppController" ng- submit="submit()">  

<input type="text" placeholder="first name" name='name' ng-  model="user.Name"/>
<br>
<input type="text" placeholder="email address" name="name" ng-model="user.email"/>
<br>
<input type="text" placeholder="age" name="age" ng-model="user.age"/>
<br>

script.

App.controller('AppController', function ($scope){

)}

Solution

  • var app = angular.module('TryApp', [], function() {})
    
    app.controller('AppController', function($scope) {
      $scope.user = {};
      $scope.submit = function() {
        //here $scope.user will have all the 3 properties
        alert(JSON.stringify($scope.user));
      }
    })
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <div id="content" ng-app="TryApp" ng-controller="AppController">
      <form ng-submit="submit()">
        <input type="text" placeholder="first name" name='name' ng-model="user.Name" />
        <br>
        <input type="text" placeholder="email address" name="name" ng-model="user.email" />
        <br>
        <input type="text" placeholder="age" name="age" ng-model="user.age" />
        <br>
        <input type="submit" value="Save" />
        <p>{{user | json }}</p>
      </form>
    </div>

    Note: for submit handler to work, you need a form and a submit button as shown above