I have successfully implemented a basic form using AngularJS. The issue I am facing is that even after the user enters their details and submits the form, the values remain in the input fields. My goal is to store the details of multiple fields in the console upon submission and then clear the fields so that the next person can enter their details. All user information will be saved in the console temporarily for future retrieval.
View code:
<html lang="en" ng-app="person_info">
<head>
<meta charset="utf-8">
<title>Person info</title>
<script src="../angular.min.js"></script>
<script src="controller_class2.js"></script>
</head>
<body ng-controller="info">
<div class="forms">
Name: <input type="text" value="name" ng-model="person.name"> </br></br>
First Name : <input type="text" value="fname" ng-model="person.firstname"></br></br>
Phone Number : <input type="text" value="number" ng-model="person.number"></br></br>
Email : <input type="email" value="email" ng-model="person.email"></br></br>
Address : <input type="text" value="address" ng-model="person.address"></br></br>
<input type="submit" value="submit" name="submit" ng-click="test()">
</div>
<p>Name : {{person.name}}</p>
<p>{{person.firstname}}</p>
<p>{{person.number}}</p>
<p>{{person.email}}</p>
<p>{{person.address}}</p>
{{ person | json }}
Controller code :
var person_info = angular.module('person_info', []);
person_info.controller('info', function($scope) {
$scope.test = function () {
console.log($scope.person);
}
});