Ajax Form

[ShoeLace1291]

I have a form that uses ajax to validate the info provided.  I can't figure out why, but the form still submits, even when left blank.

 

My Ajax.php file:

<?php
$do = $_GET['do'];
switch($do){

case "thread_info":

$thread = array(
				'title' => $_GET['title'],
				'description' => $_GET['description'],
				'body' => $_GET['body']
				);

header('Content-Type: text/xml');
	header('Pragma: no-cache');
	echo '<?xml version="1.0" encoding="UTF-8"?>';
	echo '<errors>';

if(!$thread['title']){
		echo "<li>You must enter a title!</li>";
}
if(strlen($thread['title']) > 25){
		echo "<li>The title is too long.</li>";
} 
if(strlen($thread['title']) < 10){
		echo "<li>The title is too short.</li>";
}
if(!$thread['description']){
		echo "<li>You must enter a description.</li>";
}
if(strlen($thread['description']) > 15){
		echo "<li>The description is too long!</li>";
}
if(strlen($thread['description']) < 5){
		echo "<li>The description is too short!</li>";
}
if(!$thread['body']){
		echo "<li>You must enter a message for your post!</li>";
}
if(htmlspecialchars($thread['body'])){
		echo "<li>Your body contains invalid content.  HTML is not allowed in posts.</li>";
}

echo "</errors>";

break;

default: 

	echo "Invalid action.";

break;

}
?>

 

java script:

function validateThread(){

  var title = getElementByID("title");
  var description = getElementByID("description");
  var message = getElementByID("body");
  
  if (window.XMLHttpRequest) {
	http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
	http = new ActiveXObject("Microsoft.XMLHTTP");
}
handle = document.getElementById(userid);
var url = 'classes/ajax.php?';

	var fullurl = url + 'do=thread_info&title=' + encodeURIComponent(title.value) + '&description=' + encodeURIComponent(description.value) + '&body=' + encodeURIComponent(message.value);
	http.open("GET", fullurl, true);
	http.send(null);
	http.onreadystatechange = statechange_errors;

ajaxRequest.onreadystatechange = statechange_errors(){
  html = getElementByTagName("errors");
  if(html.value > 0){
	  document.getElementById('form_errors').style.display='visible';
	document.getElementByID('form_errors').innerHTML = html;
	return FALSE;
  } else {
	document.thread.submit();
  }
}
}

 

Form:

<div id='boards'>

<ul id='form_errors' style='display: none;'>
</ul>
  <form action='ACTION' method='POST' name='register' onsubmit="validateThread(); return false;">
<table align='center' width='100%' cellspacing='1' cellpadding='3' border='0'>
  <tr>
	<td align='center' colspan='2' class='category_top'>Create Thread</td>
  </tr><tr>
	<td align='right'>Title: </td>
	<td align='left'><input type='text' name='title' size='30' id='title'></td>
  </tr><tr>
	<td align='right'>Description: </td>
	<td align='left'><input type='text' name='description' size='30' id='description'></td>
  </tr><tr>
	<td align='right'>Body: </td>
	<td align='left'><textarea name='body' rows='10' cols='40' id='title'></textarea></td>
  </tr><tr>
	<td align='center' colspan='2'><input type='submit' name='submit' value='Post'></td>
  </tr><tr>
</table>
  </form>
</div>

 

It's also supposed to update the form_errors unordered list above the form to display the error messages created in the Ajax file.  Please, please, please, please, please help!