0

this won't validate!! any suggestions? it for some reason doesn't call the ValidateFrom function...

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet" type="text/css">
<title>User Details</title>
<script type="text/javascript">

function validateForm(){
  
  var x=document.forms["myForm"]["username"].value
if (x==null || x=="")
  {
  alert("username must be filled out");
  return false;
  }
  
  var y=document.forms["myForm"]["email"].value
if (y==null || y=="")
  {
  alert("email must be filled out");
  return false;
  }
  
  var z=document.forms["myForm"]["firstname"].value
if (z==null || z=="")
  {
  alert("firstname must be filled out");
  return false;
  }
  
  var a=document.forms["myForm"]["surname"].value
if (a==null || a=="")
  {
  alert("surname must be filled out");
  return false;
  }
  
  var b=document.forms["myForm"]["birthday"].value
if (b==null || b=="")
  {
  alert("birthday must be filled out");
  return false;
  }
  
  var c=document.forms["myForm"]["password"].value
if (c==null || c=="")
  {
  alert("password must be filled out");
  return false;
  }
  
  var d=document.forms["myForm"]["pwdconfirm"].value
if (d==null || d=="")
  {
  alert("pwdconfirm must be filled out");
  return false;
  }
  
  var e=document.forms["myForm"]["gender"].value
if (e=="nothing")
  {
  alert("gender must be chosen");
  return false;
  }
  validateEmail();
}

function validateEmail(){
	echo "i got to here.. ";
	var h=document.forms["myForm"]["email"].value
	var atpos=h.indexOf("@");
	var dotpos=h.lastIndexOf(".");
	if (atpos<1 || dotpos<atpos+2 || dotpos+2>=h.length){
		alert("Not a valid e-mail address");
		return false;
	}
validateDate();
 }
 
 function validateDate(){
 var chkdate = document.forms["myForm"]["birthday"].value
	if(chkdate.match(/^[0-9]{4}\-(0[1-9]|1[012])\-(0[1-9]|[12][0-9]|3[01])/)){
	  alert("works out");
	}
	else{
		alert("date format is wrong");
		return false;
	}
 }
 
</script>
</head>
<body>
<div class="center">
<h1>Enter your details user!!</h1>
<form name = "myForm" id = "myForm" action = "display.php" onsubmit = "return validateForm()"  method = "post" novalidate="novalidate">
<table border = "1">
<tr>
	<td>Username: </td>
	<td><input type="text" name="username" /></td>
</tr>
<tr>
	<td>Email: </td>
	<td><input type="email" name="email" /></td>
</tr>
<tr>
	<td>First name: </td>
	<td><input type="text" name="firstname" /></td>
</tr>
<tr>
	<td>Surname: </td>
	<td><input type="text" name="surname" /></td>
</tr>
<tr>
	<td>Date of Birth(YYY-MM-DD): </td>
	<td><input type="date" name="birthday" /></td>
</tr>
<tr>
	<td>Password: </td>
	<td><input type="password" name="password" /></td>
</tr>
<tr>
	<td>Password Confirm: </td>
	<td><input type="password" name="pwdconfirm" /></td>
</tr>
<tr>
	<td>Gender: </td>
	<td><select name="gender">
			<option value="nothing"></option>
			<option value="Male">M</option>
			<option value="Female">F</option>
		</select>
	</td>
</tr>
<tr>
	<td>Press to Continue:</td>
	<td><input type="submit" value="submit" /></td>
</tr>
</table>
</form>
</div>
</body>
</html>
2
Contributors
4
Replies
5
Views
6 Years
Discussion Span
Last Post by blotind
0

15 years later, tables for layout with an HTML5 doctype... *sigh*

If your form is not functioning correctly, it is probably because of your JavaScript, not because of your outdated HTML markup. Please be more specific when asking questions, and post in the correct forum.

Regards
Arkinder

0

sorry i'm new to daniweb wasn't sure where the correct place was to post this..
i used a table because it was the easiest way that came to mind, and all the above validates according to html5 spec, and yes i know it's my javascript or at least the way i'm calling it, but i've spent the last three hours checking my code and w3c etc, just can't find the problem. Anyways, i'll just keep on at it :))

0

No worries, but you should use the label tag and CSS. For example:

<form action="register.php" method="post">
	<fieldset>
	<legend>Registeration</legend>
		<label for="fullname">Your full name:</label>
			<input type="text" name="fullname" class="resetfont"><br>
		<label for="username">Username:</label>
			<input type="text" name="username" class="resetfont"><br>
		<label for="password">Choose a password:</label>
			<input type="password" name="password" class="resetfont"><br>
		<label for="fullname">Repeat password:</label>
			<input type="password" name="repeatpassword" class="resetfont"><br>
		<label for="email">Email:</label>
			<input type="text" name="email" class="resetfont"><br>
		<input type="submit" name="submit" class="resetfont" value="Register">
	</fieldset>
	</form>
* {
			margin: 0;
			padding: 0;
			font-size: 100%;
		}
		form {
			margin: 0.625em;
		}
		fieldset {
			padding: 0.625em;
			background-color: #F2EFE9;
			border: 1px solid #FFF;
			border-top: 1px solid #000;
			border-bottom: 1px solid #000;
		}
		legend {
			font-weight: bold;
		}
		label, input {
			display: block;
		}
		label {
			float: left;
			width: 10em;
		}
		.resetfont {
			font-size: small;
		}

JavaScript is just not my thing. So just re-post your question in the JavaScript section and someone should be able to help you.

Regards
Arkinder

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.