Created
September 13, 2016 13:30
-
-
Save patrickpackham/5595ad3bdac23f399b2c60a239575a23 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<title>Assignment 2</title> | |
<link rel="stylesheet" type="text/css" href="styles.css"> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> | |
<script type="text/javascript" src="validate.js"></script> | |
</head> | |
<body> | |
<div id="content"> | |
<h1>Register</h1> | |
<form name ="register" action="" onsubmit="return validateInput()" method="post" > | |
<label>Name:</label> | |
<input type="text" name="name" /> | |
<label>E-mail:</label> | |
<input type="email" name="email" /> | |
<label>Date of Birth:</label> | |
<input type="date" name="dob" /> | |
<input type="submit" name="submit" /> | |
</form> | |
</div> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var name = ""; | |
var email = ""; | |
var dob = ""; | |
function validateInput() { | |
//retrieve all the form elements | |
var validate = document.forms["register"].elements; | |
//loop through and validate the input | |
for (var i = 0; i < validate.length; i++) { | |
var check = validate[i]; | |
//validate text input | |
if (check.type == "text" && check.value === "") { | |
displayMsg("Please fill out all fields." + check.innerHTML); | |
return false; | |
} | |
//ensure text input is letters only | |
var re = (/[a-z]/i); | |
if (check.type === "text" && !re.test(check.value)) { | |
displayMsg("Please enter only "); | |
return false; | |
} | |
//ensure valid e-mail format | |
var re = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/; | |
if (check.type === "email" && !check.value.match(re)) { | |
displayMsg("Please enter a valid email address"); | |
return false; | |
} | |
if (check.type === "date") { | |
var finalDate = check.value.toString(); | |
finalDate = finalDate.replace(/-/g,"/"); | |
} | |
} | |
name = validate[0].value; | |
email = validate[1].value; | |
dob = finalDate; | |
var id = JSON.stringify(register()); | |
console.log(id); | |
} | |
function register() { | |
var id = $.post("http://turing.une.edu.au/~jbisho23/assignment2/register.php", | |
{ | |
name: name, | |
email: email, | |
dob: dob | |
}); | |
return id; | |
} | |
//sliding error message | |
function displayMsg(msg) { | |
var $test = $('.msg'); | |
if ($test.length == 0) { | |
var $form = $('form'); | |
$form.append('<span class="msg">' + msg + '</span>'); | |
var $show = $('.msg'); | |
$show.addClass('show'); | |
$show.css('display', 'none'); | |
} | |
$show.fadeToggle(1000); | |
if ($show.hasClass('out')) | |
$show.removeClass('out'); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment