views/partyPlanner/beacon.ejs
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="/css/stylesheet.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</head>
<body>
<section class="container">
<section class="center jumbotron" style="background:rgba(0, 0, 0, .8);margin-right:15%;margin-left:15%;">
<h2 id='beacon-title'>Please register your party beacon</h2>
<% if (errorID == 1) { %>
<p class='error-message'>You must add beacon's numbers.</p>
<% } %>
<form action="/partyplanner/beacon/<%-spotifyID %>" method="post" class="form-horizontal form-inline" id="beacon-details-form" name="beacon-details-form">
<fieldset>
<!-- <input type="hidden" name="spotifyID" id="spotifyID"> -->
<div class="control-group">
<label for="beaconMajor" class="control-label">Beacon Major:</label>
<div class="controls">
<input name="beaconMajor" placeholder="major" type="text" style="color:black;" id='major'>
</div>
</div>
<div class="control-group">
<label for="beaconMinor" class="control-label">Beacon Minor:</label>
<div class="controls">
<input name="beaconMinor" id="minor" placeholder="minor" type="text" style="color:black;" id='minor'>
</div>
</div>
<div class="form-actions">
<input type="submit" value="Save" id="savebeacon" class="btn btn-lg btn-inverse">
</div>
</fieldset>
</form>
</section>
</section>
</body>
</html>