Using AngularJS, I'm trying to post data from a form into an ng-repeat and save to a database. When I click submit, I get the 404 error for post and get. Can someone help show me where I went wrong?
Here's my html:
<html ng-app="Inventory-App">
<head>
<meta charset="utf-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.js" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<!-- SEMANTIC -->
<link rel="stylesheet" type="text/css" href="../semantic/dist/semantic.min.css">
<script src="../semantic/dist/semantic.min.js"></script>
<!-- MY STUFF -->
<link rel="stylesheet" href="../css/styles.css" media="screen" title="no title" charset="utf-8">
<script src="../scripts/script.js" charset="utf-8"></script>
<script src="../scripts/services/itemsAPI.js" charset="utf-8"></script>
<script src="../scripts/controllers/main.js" charset="utf-8"></script>
<script src="../scripts/app.js" charset="utf-8"></script>
</head>
<body ng-controller="MainController">
<nav>
<h1>Cabinet.me</h1>
<p>An Inventory of Your Kitchen</p>
</nav>
<div class="ui container">
<form class="ui form">
<div class="field">
<label>Item</label>
<input type="text" placeholder="Item" ng-model="post.name">
</div>
<div class="field">
<label>Details (if any)</label>
<input type="text" placeholder="Details" ng-model="post.details">
</div>
<div class="field">
<label>Amount</label>
<select class="ui dropdown" ng-model="post.amount">
<option value="">Amount</option>
<option value="1">High</option>
<option value="1">Medium</option>
<option value="0">Low</option>
</select>
</div>
<button class="ui button" type="submit" ng-click="createItem(post)">Submit</button>
</form>
<div class="ui divider"></div>
<div class="ui cards">
<div class="card" ng-repeat="item in items | orderBy: 'created_at':true">
<div class="content">
<div class="header">{{item.name}}</div>
<div class="meta">Availability: {{item.amount}}</div>
<div class="description">
{{item.details}}
</div>
<button class="ui secondary button">
Delete
</button>
</div>
</div>
</div>
</div>
</body>
</html>
Here's my Controller:
angular
.module('mainController', ['itemsAPI'])
.controller('MainController', ['$scope', '$http', 'itemsAPI',
function( $scope, $http, itemsAPI ) {
$scope.items = [];
// $scope.itemData = '';
$scope.createItem = function(post){
var newItem = {
item : {
name: post.name,
details: post.details,
amount: post.amount
}
}
itemsAPI.create(newItem).then(function(response){
console.log(response);
$scope.items.push(response.data);
})
itemsAPI.getAll().then(function(response){
$scope.items = response.data;
});
}
$scope.removeItem = function(item){
itemsAPI.remove(item._id).then(function(response){
if (response.status == 203) {
$scope.items = $scope.items.filter(function(i){
return i._id != item._id;
});
}
});
}
}]);
Here's the itemsAPI code:
angular
.module('itemsAPI', [])
.factory('itemsAPI', ['$http',
function($http) {
return {
getAll: function(){
return $http.get('/items');
},
create: function(newItem){
return $http.post('/items', newItem);
},
remove: function(id){
return $http.delete('/items/' + id);
}
}
}])
And my API route:
var express = require('express');
var router = express.Router();
var Item = require('../../models/item');
// Get
router.get('/', function(req, res, next) {
Item.find(function(err, items) {
if (err) {
next(err);
}else {
res.json(items);
}
})
});
router.post('/', function(req, res, next) {
Item.create(req.body.item, function(err, item) {
if (err) {
next(err);
}else {
res.json(item);
}
});
});
router.delete('/:id', function(req, res, next) {
Item.findByIdAndRemove(req.params.id, function(err) {
if (err) {
next(err);
}else {
res.status(203).end();
}
})
});
module.exports = router;
I appreciate any help I can get!
Replace this
router.post('/', function(req, res){
with
router.post('/items', function(req, res){
in inventory/server/routes/api/items.js
Edit:
I'm mistaken. You use '/api/items' route in app.js and not necessary to add 'items' path as I wrote above. But on the client side you try to post your data on the '/items' route not on '/api/items'.
Related
I am new to angularJS and I couldn't understand why this error is coming. Please help find where I have done mistake.
index.html
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<title>Angular JS Web-Socket</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
<script src="js/chat.js"></script>
<script src="lib/ngDialog.js"></script>
<link rel="stylesheet" type="text/css" href="css/ngDialog-theme-default.css">
<link rel="stylesheet" type="text/css" href="css/ngDialog.css">
<body>
<button ng-controller="MainCtrl" ng-click="openChatBox()">Open</button>
</body>
</html>
chatBox.html
<script src="lib/ngDialog.js"></script>
<script src="lib/angular-websocket.js"></script>
<script src="js/socket.js"></script>
<link rel="stylesheet" type="text/css" href="css/ngDialog.css">
<link rel="stylesheet" type="text/css" href="css/chat.css">
<!-- The Modal -->
<div id="myModal" class="modal" ng-app="chatSocket">
<!-- Modal content -->
<div class="modal-content">
<div class="modal-header">
<div class="menu">
<div class="name">Bot</div>
<div class="close">Close</div>
</div>
</div>
<div class="modal-body" ng-controller="msgController">
<h2>Modal body</h2>
<label ng-repeat="item in socket.msg">
Name : {{item.name}} <br>
Msg : {{item.msg}}
</label>
</div>
<div class="modal-footer">
<h3>Modal Footer</h3>
<form ng-submit="submit()">
<input type="text" ng-model="msgbox">
<button id="sendMsg" type="submit" >Send Message</button>
</form>
</div>
chat.js
var app = angular.module('MyApp', ['ngDialog']);
app.controller('MainCtrl', function ($scope, ngDialog) {
$scope.openChatBox = function() {
ngDialog.openConfirm({template: 'chatBox.html',
scope: $scope //Pass the scope object if you need to access in the template
}).then(
function(value) {
//You need to implement the saveForm() method which should return a promise object
$scope.closeChat().then(
);
},
function(value) {
//Cancel or do nothing
}
);
};
});
socket.js
angular.module('chatSocket', ['ngWebSocket'])
.factory('socket', function ($websocket) {
// Open a WebSocket connection
var ws = $websocket("ws://" + document.location.host + document.location.pathname);
var msg = [];
ws.onMessage(function (event) {
console.log('message: ', event.data);
var response;
try {
response = event.data;
} catch (e) {
console.log('error: ', e);
}
msg.push({
name: "Bot",
msg: response,
});
});
ws.onError(function (event) {
console.log('connection Error', event);
});
ws.onClose(function (event) {
console.log('connection closed', event);
});
ws.onOpen(function () {
console.log('connection open');
ws.send('HELLO SERVER');
});
return {
msg: msg,
status: function () {
return ws.readyState;
},
send: function (message) {
console.log(message);
msg.push({
name: "User",
msg: message,
});
ws.send(message);
}
};
})
.controller('msgController', function ($scope, socket) {
$scope.socket = socket;
$scope.submit = function () {
socket.send($scope.msgbox);
};
});
If I didn't use msgController, the dialog box is opening. when I include this, the error is shown and couldn't open the dialog box.
Because you are referencing the msgController in openConfirm method of ngDialog and you didn't define it.
ngDialog.openConfirm({
template: 'chatBox.html',
controller: 'msgController',
scope: $scope //Pass the scope object if you need to access in the template
})
In addition to that you have specified msgController in chatSocket module and you are using it in MyApp module which is why you are getting the error.
You need to specify the chatSocket as dependency to MyApp module and define the msgController on MyApp module like blow:
var app = angular.module('MyApp', ['ngDialog','chatSocket']);
app.controller('msgController', function ($scope, socket) {
$scope.socket = socket;
$scope.submit = function () {
socket.send($scope.msgbox);
};
});
I have the following in my view:
<label for="txtFrom">Pickup Location</label>
<input type="text" id="pickup" placeholder="Address, aiport, train station, hotel..." ng-model="pickup">
<label for="txtDestination">Destination</label>
<input type="text" id="destination" placeholder="Address, aiport, train station, hotel..." ng-model="destination">
<input class="btn btn-success" name="calcPrice" id="calcPrice" type="submit" value="Calculate Price" ng-click="calcPrice()">
I am using google maps api for places to autocomplete the input boxes, so if a user starts typing "Lo", he will get a list of places that starts with "Lo" and for example he chooses London.
The problem is in my controller I am not getting the whole autocompleted value. I am only getting what the user initially entered, in this case "Lo".
Here is my controller:
app.controller('BookingsCtrl', function($scope, BookingsService) {
$scope.pickup = "";
$scope.destination = "";
$scope.syncNotification = "";
$scope.calcPrice = function() {
console.log($scope.pickup);
BookingsService.save({
pickup: $scope.pickup,
destination: $scope.destination
}, function(response) {
console.log(response.message);
});
};
});
EDIT:
Here is also a snippet of the JS:
var pickup = document.getElementById('pickup');
var options = {
componentRestrictions: {
country: 'ee'
}
};
var autocompletePickup = new google.maps.places.Autocomplete(pickup, options);
google.maps.event.addListener(autocompletePickup, 'place_changed', function () {
var place = autocompletePickup.getPlace();
pickup.innerHtml = place.formatted_address;
var lat = place.geometry.location.lat();
var long = place.geometry.location.lng();
});
EDIT 2 : Added service
app.service('BookingsService', function ($resource) {
return $resource('http://localhost:3000/', {});
});
EDIT 3 : Template
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="components/bootstrap/dist/css/bootstrap.min.css" type="text/css" />
<link rel="stylesheet" href="assets/css/style.css" type="text/css" />
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDt1Y30OssBToIzSCOr3g5IkN3c0D75XVE&libraries=places"
></script>
</head>
<body ng-app='strelsau_client'>
<div class="site-wrapper">
<div class="site-wrapper-inner">
<div class="cover-container">
<div class="masthead clearfix">
<div class="inner">
<img class="masthead-brand" src="../assets/img/logo.png">
<nav>
<ul class="nav masthead-nav">
<li class="active">Home</li>
<li>Contact</li>
</ul>
</nav>
</div>
</div>
<div ng-view>
</div>
</div>
</div>
</div>
<script src="components/jquery/dist/jquery.min.js"></script>
<script src="components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="components/angular/angular.min.js"></script>
<script src="components/angular-route/angular-route.min.js"></script>
<script src="components/angular-resource/angular-resource.min.js"></script>
<script src="js/main.js"></script>
<script src="js/controllers/bookings_controllers.js"></script>
<script src="js/services/bookings_service.js"></script>
</body>
</html>
In fact pickup input element is not getting updated once the place is resolved.
The problem with this function:
google.maps.event.addListener(autocompletePickup, 'place_changed', function () {
var place = autocompletePickup.getPlace();
pickup.innerHtml = place.formatted_address; //invalid
//...
});
For setting input field value should be used value property.
Anyway, given the example, try to replace it with:
(function (scope) {
google.maps.event.addListener(autocompletePickup, 'place_changed', function () {
var place = autocompletePickup.getPlace();
scope.pickup = place.formatted_address;
});
})($scope);
Example
angular.module('myApp', [])
.controller('BookingsCtrl', function ($scope) {
$scope.pickup = "";
$scope.destination = "";
$scope.syncNotification = "";
var pickup = document.getElementById('pickup');
var options = {
componentRestrictions: {
country: 'ee'
}
};
var autocompletePickup = new google.maps.places.Autocomplete(pickup, options);
(function (scope) {
google.maps.event.addListener(autocompletePickup, 'place_changed', function () {
var place = autocompletePickup.getPlace();
scope.pickup = place.formatted_address;
});
})($scope);
$scope.calcPrice = function () {
console.log($scope.pickup);
alert($scope.pickup);
/*BookingsService.save({
pickup: $scope.pickup,
destination: $scope.destination
}, function (response) {
console.log(response.message);
});*/
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div ng-app="myApp" ng-controller="BookingsCtrl" ng-cloak>
<label for="txtFrom">Pickup Location</label>
<input type="text" id="pickup" placeholder="Address, aiport, train station, hotel..." ng-model="pickup">
<label for="txtDestination">Destination</label>
<input type="text" id="destination" placeholder="Address, aiport, train station, hotel..." ng-model="destination">
<input class="btn btn-success" name="calcPrice" id="calcPrice" type="submit" value="Calculate Price" ng-click="calcPrice()">
</div>
I have been having this issue with Controllers in Angular. I looked it up as much as possible, but I could not resolve the issue.
I am trying to implement a simple controller, but for the life of me, I cannot get the binding to work. It's not displaying my data. For example when I say, {{ test }}, I get just that, not the "Hello World!" string.
var app = angular.module('App', []);
app.controller('Hi', function($scope){
$scope.hello = "hello!";
});
app.controller('todoCtrl', ['$scope', '$http', function($scope, $http) {
$scope.test = "Hello World!";
$scope.formData = "";
$http.get('/api/todos')
.success(function(data) {
$scope.todos = data;
console.log(data);
})
.error(function(data) {
console.log('Error: ' + data);
});
$scope.createTodo = function() {
$http.post('/api/todos', $scope.formData)
.success(function(data) {
$scope.formData.text = "";
$scope.todos = data;
console.log(data);
})
.error(function(data) {
console.log('Error: ' + data);
});
};
$scope.deleteTodo = function(id) {
$http.delete('/api/todos/' + id)
.success(function(data) {
$scope.todos = data;
console.log(data);
})
.error(function(data) {
console.log('Error: ' + data);
});
};
}]);
<!DOCTYPE html>
<html ng-app="App">
<head>
<title>TodoX</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<!-- TodoX CSS -->
<link rel="stylesheet" type="text/css" href="stylesheets/style.css"/>
</head>
<body ng-controller="todoCtrl">
<div class="container">
<div class="row">
<div class="jumbotron text-center">
<h1>TodoX<span>{{todos.length}}</span>{{test}}</h1>
</div>
<div class="col-md-8">
<div class="list-group">
<div class="checkbox" ng-repeat="todo in todos | orderBy:date">
<label class="list-group-item">
<input type="checkbox"/> {{todo.text}}
</label>
</div>
</div>
</div>
<div class="col-md-4">
<form class="form-group">
<input type="text" class="form-control" ng-model="formData"/>
<input type="submit" ng-click="createTodo()" placeholder="Submit" class="form-control"/>
</form>
</div>
</div>
</div>
<!-- Angular JS -->
<script type="text/javascript" href="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
<!-- TodoX Core JS -->
<script type="text/javascript" href="core.js"></script>
</body>
</html>
I just executed your code while placing angular file link above the script tag, so that AngularJs is loaded before your script can call angular modules.
I think you're putting angular after your script which is why you are running into this issue. Your code works just fine. I tested it.
Put it like this
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
<script src="script.js"></script>
Here script.js will be your controller script.
Working fiddle
I am making an AngularJS app,in which I am using Express as backend. The problem is,whenever I run my app
angular.js:36Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.0-beta.14/$injector/modulerr?p0=starter&p1=….com%2Fajax%2Flibs%2Fangularjs%2F1.3.0-beta.14%2Fangular.min.js%3A18%3A139)
Above error occurs in browser's console. I have tried many solutions but none of them worked.
My index.html is
<!DOCTYPE html>
<html ng-app="starter">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>AngularJS Routing example</title>
<script src="hhtp://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.14/angular.min.js"></script>
<script src="http://localhost/try/www/js/ng-cordova.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-3">
<ul class="nav">
</ul>
</div>
<div class="col-md-9">
<div ng-view></div>
</div>
</div>
</div>
<script src="http://localhost/try/www/js/app.js"></script>
<script src="http://localhost/try/www/js/master_serverquery.js"></script>
<script src="http://localhost/try/www/js/employeeCtrl.js"></script>
</body>
</html>
My login.html is
<!DOCTYPE html>
<html >
<head>
<meta charset="utf-8">
<title>Daily UI - Day 1 Sign In</title>
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700|Lato:400,100,300,700,900' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://localhost/try/www/css/animate.css">
<link rel="stylesheet" href="http://localhost/try/www/css/style.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.14/angular.min.js"></script>
<script src="http://localhost/try/www/js/ng-cordova.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>
</head>
<body ng-app="starter" >
<div ng-controller="loginCtrl">
<div class="top">
<h1 id="title" class="hidden"><span id="logo"></span></h1>
</div>
<div class="login-box animated fadeInUp">
<div class="box-header">
<h2>Log In</h2>
</div>
<form method="POST">
<label for="username">Username</label>
<br/>
<input type="text" name = "login" ng-model="loginId">
<br/>
<label for="password">Password</label>
<br/>
<input type="password" name = "password" ng-model = "loginPassword" >
<br/>
<button type="submit" ng-click = "loginFunc()">Sign In</button>
<br/>
Add New Order
</form>
<p class="small">Forgot your password?</p>
</div>
</div>
<script src="http://localhost/try/www/js/app.js"></script>
<script src="http://localhost/try/www/js/master_serverquery.js"></script>
</body>
</html>
My app.js is
var app = angular.module('starter', ['ngRoute','ngCordova']);
console.log("error")
app.run(function( $cordovaSQLite) {
db = window.openDatabase("marketplace.db", '1', 'my', 1024 * 1024 * 100);
$cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS user_master_vendor (server_db_column_id integer, name text)");
console.log("browser");
});
app.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/login', {
templateUrl: 'template/login.html',
controller: 'loginCtrl'
}).
otherwise({
redirectTo: '/login'
});
}]);
app.run(function($rootScope){
$rootScope.project_url = 'http://127.0.0.1:8081';
})
app.controller('loginCtrl',function($scope, $http, $rootScope ,$location, $cordovaSQLite){
$scope.loginFunc = function($scope){
var loginPassword = $scope.loginPassword;
var loginId = $scope.loginId;
console.log(" loginCtrl");
$scope.user = {
loginId : loginId,
loginPassword : loginPassword
}
alert($scope.user.loginId);
var loginUrl = $rootScope.project_url + '/login_post';
$http({
method : 'POST',
url : loginUrl,
headers: {
'Content-Type': undefined
},
params: {
loginId : loginId,
loginPassword : loginPassword
},
dataType: 'json',
processData : false
}).then(function successCallback(response) {
console.log(response.data.result[0].Emp_Id);
console.log(response.data.result[0].Emp_Password);
console.log("successCallback called");
var server_db_column_id = response.data.result[0].Id;
var user_name = response.data.result[0].Name;
$cordovaSQLite.execute(db, 'INSERT INTO user_master_vendor (server_db_column_id, name) VALUES (?, ?)',
[server_db_column_id, user_name])
.then(function(result) {
console.log("Data Saved Successfully in user_master at INSERT ID -> " + result.insertId);
console.log("Data user_empId-> " + user_empId + ", user_empPassword->" +user_empPassword);
},
function(error) {
$scope.showp = "Data could not be saved in user_master_vendor Error -> " + error.message;
console.log(error);
});
}, function errorCallback(response) {
alert("failure: "+response);
});
}
});
Thanks a lot for helping me.I have found the soultion for the problem,it required downloading angular-route module using npm.The below link helped me.
https://docs.angularjs.org/api/ngRoute
I followed all the steps and was able to solve the problem.
I have been trying to figure how to make my MEAN APP to show a message saying Data Successfully entered! I am not sue how to go about this I am new to MEAN and still learning.
insert.html
<!DOCTYPE>
<html ng-app="myApp">
<head>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<title>Contact list app</title>
</head>
<body>
<div class="container" ng-controller="AppCtrl">
<h1>Contact List App</h1>
<table class="table">
<div class="row">
<div class="form-group col-xs-5 col-lg-4">
<label for="name">Name</label>
<input type="text" class="form-control " ng-model="contact.name"/>
</div>
</div>
<div class="row">
<div class="form-group col-xs-5 col-lg-4 ">
<label for="email">Email</label>
<input type="text" class="form-control " ng-model="contact.email"/>
</div>
</div>
<div class="row">
<div class="form-group col-xs-5 col-lg-4 ">
<label for="number">Number</label>
<input type="text" class="form-control "ng-model="contact.number" />
</div>
</div>
<br>
<div class="row">
<button type="submit" class="btn btn-default" ng-click="addContact()">Add Contact</button>
</div>
</table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="controllers/controller.js"></script>
</body>
</html>
controller.js
var myApp = angular.module('myApp', []);
myApp.controller('AppCtrl', ['$scope', '$http', function($scope, $http) {
console.log("Hello World from controller");
var refresh= function(){
$http.get('/contactlist').success(function(response) {
console.log("I got the data I requested");
$scope.contactlist = response;
$scope.contact = "";
});
};
refresh();
$scope.addContact = function(){
console.log($scope.contact);
$http.post('/contactlist', $scope.contact).success(function(response){
console.log(response);
refresh();
});
};
$scope.remove = function(id){
console.log(id);
$http.delete('/contactlist/' + id).success(function(response){
refresh();
});
};
$scope.edit = function(id) {
console.log(id);
$http.get('/contactlist/' + id).success(function(response) {
$scope.contact = response;
});
};
}]);
server.js
var express = require('express');
var app = express();
var mongojs = require('mongojs');
var db = mongojs('contactlist', ['contactlist']);
var bodyParser = require('body-parser');
app.use(express.static(__dirname + "/public"));
app.use(bodyParser.json());
app.get('/contactlist', function (req, res){
console.log("I received a Get request")
db.contactlist.find(function(err, docs){
console.log(docs);
res.json(docs);
});
});
app.post('/contactlist', function(req, res){
console.log(req.body);
db.contactlist.insert(req.body, function(err, doc){
res.json(doc);
});
});
app.delete('/contactlist/:id', function(req, res){
var id= req.params.id;
console.log(id);
db.contactlist.remove({_id: mongojs.ObjectId(id)}, function (err, doc){
res.json(doc);
})
});
app.get('/contactlist/:id', function (req, res) {
var id = req.params.id;
console.log(id);
db.contactlist.findOne({_id: mongojs.ObjectId(id)}, function (err, doc) {
res.json(doc);
});
});
app.listen(3000);
console.log("server running on port 3000");
After the post request is completed, you can show a message:
$scope.addContact = function() {
$http.post('/contactlist', $scope.contact).success(function(response) {
alert(response);
alert("Data Inserted");
refresh();
});
};