Changing the value from the dropdown trying to open the modal and supposed to perform http request and body of will be filled with the response. But unable to open the modal. Any help will be really appreciated.
<head>
<title>Hello AngularJS</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.0/ui-bootstrap-tpls.min.js"></script>
<link href="bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller='NodeProvision'>
<select ng-model="nodes" ng-change="nodeprovision(nodes)">
<option value="">please select</option>
<option value="1">One</option>
<option value="2">Two</option>
</select>
<script type="text/ng-template" id="myModalContent.html">
<div class="modal-header">
<h3 class="modal-title">Welcome to modal!!</h3>
</div>
<div class="modal-body">
<ul>
//<div ng-if="test">
<p>The response is {{items}} <span ng-bind="{{items}}"></span><i ng-hide="items" class="icon icon-refresh icon-spin">loading.........</i></p>
//</div>
</ul>
</div>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="ok()">OK</button>
<button class="btn btn-warning" ng-click="cancel()">Cancel</button>
</div>
</script>
<!-- <div ng-if="test">
<p>The response is {{response}} <span ng-bind="{{response}}"></span><i ng-hide="response" class="icon icon-refresh icon-spin">loading.........</i></p>
</div> -->
</div>
</body>
<script>
//Initializing the app
var app = angular.module('myApp',['ui.bootstrap']);
//Defining the controller to perform the business logic
app.controller('NodeProvision', ['$scope','$http','$modal', function($scope,$http,$modal) {
$scope.nodeprovision = function(node){
$scope.animationsEnabled = true;
$scope.open = function (size) {
var modalInstance = $modal.open({
animation: $scope.animationsEnabled,
templateUrl: 'myModalContent.html',
controller: 'ModalInstanceCtrl',
size: size,
resolve: {
items: function () {
$http.get('http://ac-00075763.devapollogrp.edu:8080/NodeProvision/provision/urn:apol:provider:acp/list?guid=5d4dc79e-f623-40f8-a14f-646c59c7b89a').
success(function(data, status, headers, config) {
$scope.items = data
}).
error(function(data, status, headers, config) {
// log error
});
}
}
});
};
}
}]);
app.controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {
$scope.items = items;
$scope.ok = function () {
$modalInstance.close();
};
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
});
</script>
</html>