Humberd/simple-form.html

## simple-form.html
<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport"
		  content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"
		  integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<title>Document</title>
	<style>
		.my-container {
			display: flex;
			flex-direction: column;
			align-items: center;
		}

		.my-form {
			width: 600px;
		}
	</style>
</head>
<body>
<div class="my-container">
	<div class="page-header">
		<h1>Login</h1>
	</div>
	<form class="my-form"
		  id="my-form"
		  action="">
		<div class="form-group">
			<label for="name">Name</label>
			<input id="name"
				   class="form-control"
				   type="text">
		</div>
		<div class="form-group">
			<label for="email">Email</label>
			<input id="email"
				   class="form-control"
				   type="text">
		</div>
		<div class="form-group">
			<label for="password">Password</label>
			<input id="password"
				   class="form-control"
				   type="password">
		</div>
		<input class="btn btn-primary"
			   type="submit"
			   value="Login">
	</form>
</div>
<script>
  var AUTH_URL = '/auth/login'

  function submitFormHandler (event) {
    event.preventDefault()

    var headers = new Headers();
    headers.append('Accept', 'application/json'); // This one is enough for GET requests
    headers.append('Content-Type', 'application/json'); // This one sends body


    fetch(AUTH_URL, {
      method: "POST",
	  headers: headers,
	  body: JSON.stringify({
		name: this.querySelector("#name").value,
		email: this.querySelector("#email").value,
		password: this.querySelector("#password").value
	  })
	}).then(function (success) {
	  console.log(success);
	}, function (error) {
	  console.error(error);
	})
  }

  var myForm = document.querySelector('#my-form')
  myForm.onsubmit = submitFormHandler
</script>

</body>
</html>
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport"
	content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"
	integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<title>Document</title>
	<style>
	.my-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	}

	.my-form {
	width: 600px;
	}
	</style>
	</head>
	<body>
	<div class="my-container">
	<div class="page-header">
	<h1>Login</h1>
	</div>
	<form class="my-form"
	id="my-form"
	action="">
	<div class="form-group">
	<label for="name">Name</label>
	<input id="name"
	class="form-control"
	type="text">
	</div>
	<div class="form-group">
	<label for="email">Email</label>
	<input id="email"
	class="form-control"
	type="text">
	</div>
	<div class="form-group">
	<label for="password">Password</label>
	<input id="password"
	class="form-control"
	type="password">
	</div>
	<input class="btn btn-primary"
	type="submit"
	value="Login">
	</form>
	</div>
	<script>
	var AUTH_URL = '/auth/login'

	function submitFormHandler (event) {
	event.preventDefault()

	var headers = new Headers();
	headers.append('Accept', 'application/json'); // This one is enough for GET requests
	headers.append('Content-Type', 'application/json'); // This one sends body


	fetch(AUTH_URL, {
	method: "POST",
	headers: headers,
	body: JSON.stringify({
	name: this.querySelector("#name").value,
	email: this.querySelector("#email").value,
	password: this.querySelector("#password").value
	})
	}).then(function (success) {
	console.log(success);
	}, function (error) {
	console.error(error);
	})
	}

	var myForm = document.querySelector('#my-form')
	myForm.onsubmit = submitFormHandler
	</script>

	</body>
	</html>