Join the Stack Overflow Community
Stack Overflow is a community of 6.8 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 0 down vote favorite

I am newbie. i am not able to insert data from front end into mysql database. I am facing the problem at the time of insertion. I'm unable to trace my coding error whether it is in controller.js or in index.html or in server.js. Please help me to solve this.

my server.js code

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 is 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 INTO register SET ?', data, function(err,res){
      if(err) throw err;
        console.log('record inserted');
    });  

app.listen(5500);

console.log('Hi from server.js');

my controller.js code

 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,
                    password: $scope.pswd,
                    confirm : $scope.confirm
                }   
            };

            $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;


                });

            $scope.add.push(data);
            $scope.addNewUser = {
                    fname:"",
                    lname:"",
                    email:"",
                    phone:"",
                    password:"",
                    confirm:""
        };
});

my index.html code

<html ng-app="bookitnow">
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
   <link rel="stylesheet" href="./css/style.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>
    <div class="form-group">
        <input type="password" class="form-control" id="pswd" ng-model="pswd" placeholder="Password" required>
    </div>
    <div class="form-group">
        <input type="password" class="form-control" id="confirm" ng-model="confirm" placeholder="Confirm Password" 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>
share|improve this question
    
what is the error? can you post here? – abdulbarik Oct 14 '16 at 7:04
    
Browser responding the message: cannot POST / – Ishwar Panchariya Oct 14 '16 at 9:05
up vote 0 down vote

Your route is not proper.

This is not a valid route

app.get('/index.html')

Change your all route in on server side like this

 app.get('/', function(req, res) {//remove index.html
  res.sendFile(__dirname + '/public' + 'index.html');
});


app.post('/', function(req, res, next) {//remove index.html
      var data = req.body;
      console.log('request received:', data);

      connection.query('INSERT INTO register SET ?', data, function(err, res) {
        if (err) throw err;
        console.log('record inserted');
      });

And request from client side like this

 $http.post('/', $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;
   });

Hope this will work for you

share|improve this answer
    
You've mentioned $http.post('/', & scope.data). – Ishwar Panchariya Oct 14 '16 at 9:48
    
Here, & is unexpected token. it should be replaced with $ symbol.. – Ishwar Panchariya Oct 14 '16 at 9:49
    
I just changed your route buddy you can check rest of code – abdulbarik Oct 14 '16 at 9:50
    
Since this code is written in your question – abdulbarik Oct 14 '16 at 9:50
    
Browser now showing following error: – Ishwar Panchariya Oct 14 '16 at 10:06

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.