/* 
 For this script to work, you must put a class called 'required' on all your required form labels, like this: 
 <label for="bad_wolf" class="required">Bad Wolf</label> <input id="bad_wolf" name="bad_wolf" />
 
 You'll also need an empty paragraph with an id of 'error-message'... put the code in like this: 
 <p id="error-message">&nbsp;</p> 

You might also want to put a style in your style sheet to hide the error message p until the form is validated, like so:
#error-message{
	display: none;
}
.error, #error-message{
	color: #c00;
}
label.required{
	background: url(../images/asterisk.gif) 100% 0% no-repeat;
	padding-right: 10px;
}

 This script validates only the first form on the page.
*/

/* Validate me a form! */
function validate(){
  /* Assume the form is valid */	
  var validForm = true;
  /* Get an array of all the labels */	
  var labels = document.getElementsByTagName('label');
  var theseerrors = "";
  var theseempties = new Array();
  /* Loop through the label array */
  for (var i = 0; i < labels.length; i++) {
    /* If the label class name contains 'required', check to see if it's filled out */
	if (labels[i].className.indexOf("required") != -1) {
		labels[i].className = "required";
		var thisinputname = labels[i].getAttribute('for');
		var thislabel = labels[i].firstChild.nodeValue;
		/* If the required element is empty... */
		if(document.forms[0].elements[thisinputname].value == ""){ 
			/* Build the list of empty fields */
			theseempties.push(thislabel);
			/* Make the empty label red */
			labels[i].className = "required error";
			/* The form is not valid! */
			validForm = false;
		}
    }
  }
  /* Run through the list of empty required fields */
  for (var j = 0; j < theseempties.length; j++){
	  /* Add commas in the appropriate places */
	  if(j > 0){ theseerrors = theseerrors + ", "; }
	  theseerrors = theseerrors + theseempties[j];
  }
  if(theseerrors !== ""){
	var errorbox = document.getElementById('error-message');
	var errorboxtwo = document.getElementById('error-message-two');
	/* Show us the error-message holder */
	errorbox.style.display = "block";
	errorbox.firstChild.nodeValue = "Please fill in the following required fields:\n " + theseerrors;
	errorboxtwo.style.display = "block";
	errorboxtwo.firstChild.nodeValue = "Please fill in the following required fields:\n " + theseerrors;
  }
  /* If validForm is false, nothing happens; if validForm is true, the form gets submitted */
  return validForm;
}

window.onload = function () {
	/* If the first form on the page is submitted, run the validation function */
	document.forms[0].onsubmit = function () {
		return validate()
	}
}