- Code: Select all
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Registration of Account</title>
<style type ="text/css">
input {
font-family: sans-serif;
}
</style>
<script type ="text/javascript">
// make an array and store the variables easiest!
function isAlphanumeric(elem, helperMsg){
var alphaExp = /^[0-9a-zA-Z]+$/;
if(elem.value.match(alphaExp)){
return true;
}else{
alert(helperMsg);
elem.focus();
return false;
}
}
function emailValidator(elem, helperMsg){
var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
if(elem.value.match(emailExp)){
return true;
}else{
alert(helperMsg);
elem.focus();
return false;
}
}
function lengthRestriction(elem, min, max){
var uInput = elem.value;
if(uInput.length >= min && uInput.length <= max){
return true;
}else{
alert("Please enter between " +min+ " and " +max+ " characters");
elem.focus();
return false;
}
}
function isMatch(elem, helperMsg){
var password = document.getElementsByName('password');
if(elem.value.match(password)){
return true;
}else{
alert(helperMsg);
elem.focus;
return false;
}
}
function pass(to,from, new_to, new_from){
to.value = from.value;
new_to.value = new_from.value;
}
function notEmpty(elem, helperMsg){
if(elem.value.length == 0){
alert(helperMsg);
elem.focus(); // set the focus to this input
return false;
}
return true;
}
function formValidation(){
var username = document.getElementById('username');
var password = document.getElementById('password');
var cfm = document.getElementbyId('Confirm_password');
var email = document.getElementbyId('email');
var creditcard = document.getElementbyId('Credit_card');
if (isAlphanumeric(username, "Numbers and letters only for username!")){
if(isAlphanumeric(password, "Numbers and letters only for password!")){
if(isMatch(cfm, "Password and Confirm password do not match!")){
if(emailValidator(email, "Please enter a valid email address")){
if(isNumeric(creditcard, "Please enter only numbers!")){
return True;
}
}
}
}
}
return False;
}
</script>
</head>
<body>
<div align ="center">
<!-- Create the tables for registering account -->
<!-- Placeholder form to copy data! -->
<form name ="placeholder">
<table border ="0" cellpadding ="0" cellspacing="0">
<tr> <td width ="0"> Username:</td>
<td> <input name ="placeholder" type ="text" size ="25"
onChange="pass(document.Register.username, this, document.Check_name.Checking, this)"
onKeyUp="pass(document.Register.username, this, document.Check_name.Checking, this)"></td>
</form>
<!-- You cannot nest a new form inside another form to query DB for availability of username!!! Just copy data -->
<form method ="Post" action ="check_available.php" name="Check_name">
<td> <input name ="Check" type ="submit" value ="Check availability"></td>
<td> <input type ="hidden" name ="Checking"> </td>
</form>
<!-- Continue back in old form -->
<form action ="" method ="POST" onsubmit='return formValidation()' name ="Register">
</tr>
<tr> <td>Password:</td>
<td> <input name ="password" type ="password" Id ="password" size ="25"></td></tr>
<tr> <td width ="0">Confirm Password:</td>
<td> <input name ="Confirm_password" Id ="Confirm_password" type ="password" size ="25"></td></tr>
<tr> <td width ="0"> Email address:</td>
<td> <input name ="email" id ="email" type ="email" size ="25" ></td> </tr>
<tr> <td>Credit card</td>
<td><input name="Credit_card" id = "Credit_card" type="text" size="25"></td>
<tr><td width ="0"> Country:</td>
<td> <input name ="Country" type ="text" size ="25"></td> </tr>
<tr> <td width ="0"> Date of Birth:</td>
<td> <input name ="birthday" type ="text" size ="25"></td> </tr>
<tr> <td width ="0"> Gender:</td>
<td> <input name ="gender" type ="text" size ="25" Value =""></td> </tr>
<tr><td> <input type ="submit" name ="Create" value ="Create Your Account" onClick ="return formValidation()"> </td>
<td> <input name ="username" id ="username" type ="hidden" size ="25" ></td></tr>
</form>
</table>
</p>
<?php
?>
</body>
</html>
Hi Guys i been trying to solve this javascript problem but it doesnt seem to be able to work!!! Does any1 have any idea whr went wrong???
