Skip to content

Instantly share code, notes, and snippets.

@mphuget
Created March 7, 2018 12:45
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mphuget/1aa25850adb5fccd4ba631cb34f91efc to your computer and use it in GitHub Desktop.
Save mphuget/1aa25850adb5fccd4ba631cb34f91efc to your computer and use it in GitHub Desktop.
socnet/signup/views/pages/signup.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<script>
function check(str) {
if (str.length == 0) {
document.getElementById("taken").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("taken").innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "/signup/username/" + str, true);
xmlhttp.send();
}
}
</script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body class="container">
<main>
<h1><span class="fa fa-sign-in"></span> Signup</h1>
<!-- LOGIN FORM -->
<form class="form-horizontal" action='/signup' method="POST">
<fieldset>
<div id="legend">
<legend class="">Register</legend>
</div>
<div class="control-group">
<!-- First name -->
<div class = "controls form-inline">
<label class="control-label" for="firstName">First name</label>
<input type="text" id="firstName" name="firstName" placeholder="" class="input-xxlarge">
<!-- Last name -->
<label class="control-label" for="lastName">Last name</label>
<input type="text" id="lastName" name="lastName" placeholder="" class="input-xxlarge">
</div>
</div>
<div class="control-group">
<!-- Username -->
<label class="control-label" for="username">Username</label>
<div class="controls">
<h3 id="taken"> </h3>
<input type="text" id="username" name="username" placeholder="" class="input-xlarge" onKeyUp="check(this.value)">
<p class="help-block">Username can contain any letters or numbers, without spaces</p>
</div>
</div>
<div class="control-group">
<!-- E-mail -->
<label class="control-label" for="email">E-mail</label>
<div class="controls">
<input type="text" id="email" name="email" placeholder="" class="input-xxlarge">
<p class="help-block">Please provide your E-mail</p>
</div>
</div>
<div class="control-group">
<!-- Password-->
<label class="control-label" for="password">Password</label>
<div class="controls">
<input type="password" id="password" name="password" placeholder="" class="input-xlarge">
<p class="help-block">Password should be at least 4 characters</p>
</div>
</div>
<div class="control-group">
<!-- Password -->
<label class="control-label" for="password_confirm">Password (Confirm)</label>
<div class="controls">
<input type="password" id="password_confirm" name="password_confirm" placeholder="" class="input-xlarge">
<p class="help-block">Please confirm password</p>
</div>
</div>
<div class="control-group">
<!-- Button -->
<div class="controls">
<button class="btn btn-success">Sign me up!</button>
</div>
</div>
</fieldset>
</form>
<hr>
<p>Already have an account? <a href="/signin">Login</a></p>
</main>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment