angularjs - how to insert data into database using MEAN stack (MySQL, Express, Angular, Node) -
how insert data database using mean stack (mysql, express, angular, node)? facing problem @ time of insertion. please me solve this. here code. i'm newbie in mean.
index.html
<html ng-app="bookitnow"> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <title> registration page </title> </head> <body> <div class="container" ng-app="bookitnow" ng-controller="myctrl"> <h1>register</h1> <form method="post"> <div class="form-group"> <input type="text" class="form-control" id="firstname" ng-model="fname" placeholder="first name" required> </div> <div class="form-group"> <input type="text" class="form-control" id="lastname" ng-model="lname" placeholder="last name" required> </div> <div class="form-group"> <input type="email" class="form-control" id="email" ng-model="email" placeholder="email address" required> </div> <div class="form-group"> <input type="text" class="form-control" id="phone" ng-model="phone" placeholder="phone" required> </div> <button type="submit" class="btn btn-info" ng-click="submit()">submit</button> </form> </div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> <script src="controllers/controller.js"></script> </body> </html>
server.js
var express = require("express"); var app = express(); var bodyparser = require('body-parser'); var mysql = require('mysql'); var connection = mysql.createconnection({ host : 'localhost', user : 'root', password : '', database : 'bookitnow' }); connection.connect(function(err) { if (!err) console.log('database connected'); else console.log('db connection error.'); }); app.use(express.static(__dirname + '/public')); app.get('/index.html', function(req, res){ res.sendfile(__dirname + '/public' + 'index.html'); }); app.post('/index.html', function(req, res, next) { var data = req.body; console.log('request received:', data); connection.query('insert register set ?', data, function(err,res){ if(err) throw err; console.log('record inserted'); }); app.listen(5500); console.log('hi server.js');
controller.js
var app = angular.module('bookitnow',[]); app.controller('myctrl', function($scope,$http){ $scope.submit = function() { var data = { fname : $scope.fname, lname : $scope.lname, email : $scope.email, phone : $scope.phone } }; $http.post('/index.html', &scope.data) .success(function (data, status, headers, config) { $scope.result = data; console.log("inserted successfully") }) .error(function(data, status, header, config){ $scope.result = "data: " + status; });
in controller.js, try following , see happens.
var app = angular.module('bookitnow',[]); app.controller('myctrl', function($scope, $http){ $scope.submit = function() { var data = { fname : $scope.fname, lname : $scope.lname, email : $scope.email, phone : $scope.phone }; $http .post('/index.html', data) .then(function (response) { console.log(response) }, function(response){ console.log(response) }); }; });
Comments
Post a Comment