Submitting a form using AJAX STILL not working - ajax

Question

I've spend the past 5hours trying to avoid posting this, but i just cant find where im wrong on this code. I wish to send a comment to email without leaving the HTML page but just adding PHP echo at the bottom of the form. This is my HTML:
<form name="form1" method="post" enctype="multipart/form-data" action="javascript:submitForm();">
<table>
<tr>
<td valign="top">
<label for="first_name">First Name *</label>
</td>
<td valign="top">
<input type="text" name="first_name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="last_name">Last Name *</label>
</td>
<tr>
<td valign="top">
<label for="email">Email Address *</label>
</td>
<td valign="top">
<input type="text" name="email" maxlength="80" size="30">
</td>
</tr>
<tr>
<td valign="top">
<input type="text" name="telephone" maxlength="30" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="comments">Comments *</label>
</td>
<td valign="top">
<textarea name="comments" maxlength="1000" cols="25" rows="6"></textarea>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center">
<input type="submit" value="Submit">
</td>
</tr>
</table>
</form>
<div id="text"> </div>
my AJAX:
function submitForm(str)
{
if (str=="")
{
document.getElementById("text").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("text").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","contact.php?q="+str,true);
xmlhttp.send();
}
I can confirm that my php works fine because when i change my form action to "contact.php" it works perfectly. The problem is when I try to get the php using AJAX, firefox developer tools confirms that the contact.php is called fine with the function: submitForm() but its just not working. Can anybody help?

Answer 1

One problem is this: "contact.php?q="+str
Based on the markup above, str will always be undefined, so you are never sending your form data to contact.php. Additionally, when you set the action="contact.php" for testing, you're using a POST, and your ajax call is a GET. So you could still have problems with the PHP script.