I am attempting to make an HTTP POST request to update my database using AngularJS. Although my code is not displaying any errors, the database is not being updated and I'm having trouble pinpointing the issue. Below is the code snippet:
//topic-service.js
(function() {
'use strict';
angular.module('topic').factory('topicService', topicServiceFunction);
topicServiceFunction.$inject = [ '$http', '$q' ];
function topicServiceFunction($http, $q) {
var topicService = {
getTopics : getTopics
}
return topicService;
function getTopics(obj) {
console.log('-->topicServiceFunction');
console.log(obj.name);
var deferred = $q.defer();
return $http.post('http://localhost:8080/restapp/api/topic',
JSON.stringify(obj)).then(function(response) {
if (typeof response.data === 'object') {
return response.data;
} else {
return deferred.reject(response.data);
}
}, function(response) {
return deferred.reject(response.data);
});
}
}
}())
//topic-controller.js
(function() {
'use strict';
angular.module('topic').controller('topicController',
topicControllerFunction);
topicControllerFunction.$inject = [ '$scope', 'topicService' ];
function topicControllerFunction($scope, topicService) {
$scope.getTopics = getTopics;
function getTopics(topicId,name,description,categId,userId) {
console.log('-->topictrlFunction');
$scope.topics = [];
var obj={
id:$scope.topicId,
name:$scope.name,
description:$scope.description,
id_category:$scope.categId,
user_id:$scope.userId
}
var promise = topicService.getTopics(obj);
promise.then(function(data) {
if (data != undefined && data != null) {
$scope.topics = data;
} else {
$scope.topics = undefined;
}
}, function(error) {
console.log('error=' + error);
$scope.topics = undefined;
})
topicService.getTopics(obj);
$scope.topics = topicService.getTopics(obj);
}
}
}())
//topic.html
<!DOCTYPE html>
<html lang="en" ng-app="myTopics">
<head>
<meta charset="UTF-8">
<script src="../../../bower_components/angular/angular.js"></script>
<script src="app.js"></script>
<script src="topics/module/topic-module.js"></script>
<script src="topics/controller/topic-controller.js"></script>
<script src="topics/service/topic-service.js"></script>
<title>Topics</title>
</head>
<body>
<div ng-controller="topicController">
<div ng-controller="topicController">
<p>
Topic id: <input type="text" ng-model="topicId">
</p>
<p>
Name: <input type="text" ng-model="name">
</p>
<p>
Description: <input type="text" ng-model="description">
</p>
<p>
Id category: <input type="text" ng-model="categId">
</p>
<p>
User id: <input type="text" ng-model="userId">
</p>
<button ng-click="getTopics(topicId,name,description,categId,userId)">Add
topic</button>
<ul ng-repeat="topic in topics">
<li>{{topic.id}} --{{topic.name}} -- {{topic.description}} --
{{topic.id_category}}--{{topic.user_id}}</li>
</ul>
</div>
</body>
</html>