Untitled

Client js

window.addEventListener('loaded', function {
  document.getElementById('submit').addEventListener('submit', function(e) {
  e.preventDefault();
  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/insert', true);
  xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  xhr.onload = function () {
      // do something to response
      console.log(this.responseText);
  };
  xhr.send(new FormData(document.getElementById('signup')));
})


server js

var http = require('http');
var mysql = require('mysql');
var express = require('express');
var app = express();
var connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: '12345',
    database: 'employee'
});

console.log('MySQL Connection details  '+connection);

app.get('/:id', function(request, response) {
    connection.query('SELECT * FROM employee WHERE id='+request.params.id, function(err, rows, fields) {
        console.log('Connection result error '+err);
        response.end("result"+JSON.stringify(rows))
    });
})


app.post('/insert', function(req, res) {

    // Add these values to your MySQL database here
    connection.query("INSERT into employee (name) VALUES (?)", request.params.name, function(err, result) {
    });
});

app.use('/client', express.static(__dirname + '/client'));

app.listen(8081);


HTML

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script type="text/javascript" src="client.js"></script>
</head>
<body>
	<div id="container">
		<div id="registration">
			<form onsubmit="signup()" method="POST" id="signup">
				<label>Name <input type="text" name="name" value="foo" id="name"></label>
				<input type="submit" value="Sign Up" id="submit"></label>
			</form>
		</div>
	</div>
</body>
</html>