Help with Ajax code

[Nahiyan]

I have coded some ajax recently but whenever I click the 'register' button, nothing actually happens. I worked about about an hour to check what's wrong with the code but I failed to find any error. My php file just displays out an echo and runs some code if required POST data is set. I can run the php file and it works just fine but I cannot get Ajax to load the php file even. Can you check my script for any error?

<?php
	require 'includes/core.inc.php';
	require 'includes/connect.inc.php';
?>
<link rel=StyleSheet src='themes/<?php echo $theme; ?>/mainstyle.css' type='text/css'>
<script type='text/javascript'>
	function registeraccount(id){
		if (window.XMLHttpRequest){
			xmlhttp = new XMLHttpRequest();
		}else{
			xmlhttp = new ActiveXObject('Microsoft.XMLHttp');
		}
		
		xmlhttp.onreadystatechange = function(){
			if (xmlhttp.readyState==4 && xmlhttp.status==200){
				document.getElementById(id).innerHTML = xmlhttp.responseText;
			}
		}
		var username = document.register.username.value;
		var password = document.register.password.value;
		var password2 = document.register.password2.value;
		var email = document.register.email.value;
		var firstname = document.register.firstname.value;
		var lastname = document.register.lastname.value;
		var querystring = "username="+username+"&password="+password+"&password2="+password2+"&email="+email+"&firstname="+firstname+"&lastname="+lastname;
		xmlhttp.open('POST', 'includes/registeraccount.php' + querystring, true);
		xmlhttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');
		xmlhttp.send(querystring);
	}
</script>

<form name='register' action='' method='POST'>
	<fieldset class='fieldset'>
		<legend class='legend'>Register</legend>
		<p class='basicbox'>Note: All the fields marked with * are mandatory</p>
		<div id='result'></div><br>
		<span>Username</span> <input type='text' name='username' class='textboxbasic'/><br>
		<span>Password</span> <input type='password' name='password' class='textboxbasic' "/><br>
		<span>Password again</span> <input type='password' name='password2' class='textboxbasic'"/><br>
		<span>Email address</span> <input type='text' name='email' class='textboxbasic'/><br>
		<span>First name</span> <input type='text' name='firstname' class='textboxbasic'/><br>
		<span>Last name</span> <input type='text' name='lastname' class='textboxbasic'/><br>
		<button class='submitbutton' onClick="registeraccount('result')">Register</button>
	</fieldset>
</form>

[decade]

I see that your code is doing fine with a little edit.
this is a hint to the solution.
have you try to debug your ajax using "alert()"? especially on this part:

var username = document.register.username.value;
var password = document.register.password.value;
var password2 = document.register.password2.value;
var email = document.register.email.value;
var firstname = document.register.firstname.value;
var lastname = document.register.lastname.value;
var querystring = "username="+username+"&password="+password+"&password2="+password2+"&email="+email+"&firstname="+firstname+"&lastname="+lastname;

//check if you already past the value here:
alert (querystring);

if you got the value, try to pass the value into your php variable like:
$email = $_REQUEST();
$password = $_REQUEST();
$username = $_REQUEST();

to check if you already pass it to your php variable
echo $email;
echo $password;
echo $username;

before your other executions or method or functions or your code.

[Nahiyan]

If I alert out the 'querystring' variable, I get the values according to what I inputted.

However, if I alter the code a little :

if (xmlhttp.readyState==4 && xmlhttp.status==200){
 document.getElementById(id).innerHTML = xmlhttp.responseText;
}else{
 alert('error');
}

and run it, an alert box pops up 2 times and it says 'error'. However, my other ajax scripts work just fine.

I usually get an error whenever I try to echo the following out.

$email = $_REQUEST(['email']);
$password = $_REQUEST(['password']);
$username = $_REQUEST(['username']);

[Nahiyan]

Wait a min guys, after placing the following code:

alert(xmlhttp.status);

The alert box shows "0" instead of the expected value "200". I get 200 only in IE9 and works as expected but I get 0 in other browsers.

How can I fix this?

[Nahiyan]

This is fixed!
I just removed the form and used getElementById(); to fetch the elements' value and it worked fine!