PDA

View Full Version : So close but cannot get it to validate



webdev1957
07-01-2012, 09:12 PM
Hi, does anyone know why I cannot get this to validate? It will clear the form alright.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Validation Project</title>
<script type="text/javascript">

function num_checked(check_box_array)
{

var nchecked = 0;
for (i = 0; i < check_box_array.length; i++)
{
if (check_box_array[i].checked)
{
nchecked++;
}
return nchecked;
}
//return nchecked;

}

function isAlphabetic(elem, helperMsg)
{
var alphaExp = /^[a-zA-Z]+$/;
if (elem.value.match(alphaExp))
{

return true;
} else {
alert(helperMsg);
elem.focus();
return false;
}
}

function notEmpty(elem, helperMsg)
{

if (elem.value.length==0)
{
alert(helperMsg);
elem.focus();
return false;
}
return true;
}

function isNumeric(elem, helperMsg)
{
var numericExpression = /^[0-9]+$/;
if (elem.value.match(numericExpression))
{
return true;
} else {
alert(helperMsg)
elem.focus();
return false;
}
}

function processFormData()
{

var name = document.getElementById('yourname');
var yearborn = document.getElementById('birthyear');
var location = document.getElementById('location');
var gradyear = document.getElementById('graduation');
var myfavorites = document.getElementById('favs');


var name_warning_alpha = "Please enter letters only for your name!";
var name_warning_missing = "Please enter your name!";
var yearborn_warning = "Please enter the year you were born!";
var location_warning = "Please select a location from the drop-down list!";
var gradyear_warning = "Please select the year you will graduate!";
var myfavorites_warning = "Please select at least one of your favorites from the options shown!";

var message = "You entered the following registration information: \n\n";



var allCorrect = true; // Set error flag to true initially

if (isAlphabetic(name, name_warning_alpha))
{
allCorrect = false;
if (notEmpty(name, name_warning_missing))
{
allCorrect = false;
if (isNumeric(yearborn, yearborn_warning))
{
allCorrect = false;
if (num_checked(location,location_warning) == 0))
{
allCorrect = false;
if (num_checked(gradyear, gradyear_warning) !=1))
{
allCorrect = false;
if (num_checked(myfavorites, myfavorites_warning) !=1))
{
allCorrect = false;

} // end brace for my favorites check


if (allCorrect)
{

message += "Name: " + name + "<br />" +
"Born: " + yearborn + "<br />" +
"Home City: " + location + "<br />" +
"Graduated: " + gradyear + "<br />" +
"Favorites: " + myfavorites + ".";

return allCorrect;
alert(message);
}


</script>
</head>
<body>
<h1>Validating The Form</h1>

<form name = "registration" method = "post" action = "" >


<div class="question" id="yourname">
<p>Please enter your full name:
<input type = "text" name = "yourname">
</div>
<div class="question" id="birthyear">
<p>Please enter the year in which you were born:
<input type = "text" size = "5" name = "birthyear">
</div>
<div class="question" id="location">
<p>Which city did you move from?
<select name="location">

<option value="0">Choose one</option>
<option value="1">Omaha</option>
<option value="2">Toledo</option>
<option value="3">Indianapolis</option>
<option value="4">Chicago</option>
</select>
</div>
<div class="question" id="graduation">
<p>When did you graduate from high school?<br>
<input type = "radio" name = "graduation" value = "2010">1985<br>
<input type = "radio" name = "graduation" value = "2011">1986<br>

<input type = "radio" name = "graduation" value = "2012">1987<br>
<input type = "radio" name = "graduation" value = "2013">1988<br>
</div>
<div class="question" id="favs">
<p>What were your favorite things about the campus tour today? (Choose 1 to 3 options):
<ol start="0">
<li><input type="checkbox" name="favs" value="food">Tasty food
<li><input type="checkbox" name="favs" value="facilities">Modern facilities
<li><input type="checkbox" name="favs" value="programs">Interesting programs
</ol>

</div>
<p>
<input type = "reset">

<input type = "submit" value = "Submit" onClick = "return processFormData();">
</form>

</body>
</html>

_Aerospace_Eng_
07-01-2012, 09:54 PM
You have a lot of syntax errors with your process form data function, mostly in your if statements. Extra parentheses and lacking of closing brackets.

c1lonewolf
07-01-2012, 09:59 PM
document.getElementById('yourname');


var form = document.registration;
var name = form.yourname;

felgall
07-01-2012, 10:57 PM
Try separating the JavaScript into a different file. The HTML validator is likely to report errors in JavaScript that don't really exist simply because it thinks the JavaScript is invalid HTML.