Greetings! Currently, I am working with 2 controllers in my app.js file.
app = angular.module('dbaccess',[]);
app.controller('process', function($http, $scope,$location, $service){
$scope.update = function(user){
$scope.master = {};
$scope.master = angular.copy(user);
$http.post("http://localhost:8080/dbaccess/saveData", $scope.master).success(function(data, status, headers, config){
$scope.resp = data;
alert("This is the data" +data.message);
$('.form-horizontal').hide();
$('#response-message').html().text("Hello");
})
.error(function(data){
alert("Error " +data.message);
})
}
});
app.controller('usrEmailAddress', function($http,$scope,$location, $service){
$scope.email = {};
$http.get("http://localhost:8080/dbaccess/userlist").success(function(data){
$scope.emails = data;
});
})
The 'process' controller is used to submit data to a Java controller for processing, while 'usrEmailAddress' controller fetches JSON data from the Java controller.
I am currently facing an issue with passing email information from my index.jsp page to the process controller. Any guidance on this matter would be highly appreciated.
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"pageEncoding="ISO-8859-1"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en" ng-app="dbaccess">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Page Title Example</title>
<link rel="stylesheet" href="/dbaccess/resources/css/bootstrap.min.css">
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container" ng-controller="emailAddress as address" >
<div class="row">
<div class="col-lg-12"></div>
</div>
<form class="form-horizontal" data-toggle="validator" role="form">
<div class="form-group">
<label for="requestedBy" class="col-sm-2 control-label"> Requested By</label>
<div class="col-sm-3">
<input type="text" class="form-control" id="requestedBy" placeholder="Requestor Name" ng-model="user.requestedBy" required/>
</div>
</div>
<div class="form-group">
<div >
<label for="email" class="col-sm-2 control-label"> Email Address</label>
<div class="col-sm-3 " ng-controller='usrEmailAddress'>
<select class="form-control" ng-model="user.email">
<option value=""> --Select Email Address -- </option>
<option ng-repeat="mails in emails" value={{mails.email}} >{{mails.email}}</option>
</select>
</div>
</div>
</div>
...
</form>
<pre>form = {{user | json}}</pre>
<pre>master = {{master | json}}</pre>
</div>
</body>
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="/dbaccess/resources/js/angular.js"></script>
<script src="/dbaccess/resources/js/bootstrap.min.js"></script>
<script src="/dbaccess/resources/js/bootstrap.js"></script>
<script src="/dbaccess/resources/js/example.js"></script>
<script src="/dbaccess/resources/js/validator.min.js"></script>
</body>
</html>