How to fix "Unable to connect with the server:" in simple AJAX script?

[Rekha Kumaran]

Hi...
Im trying to connect AJAX with PHP/MYSQL. I wrote a basic code for connecting this. I got codings from http://www.w3schools.com/PHP/php_ajax_database.asp.

1) I created database and tables.
2) While i run the ajax_db.html, if i select anything, im getting

Unable to connect with the server:
[Object error]

I used document.write message and i checked the select name number is passing in the java script. But i doesnt call the xmlhttp.open(). I wrote the correct address. But im getting the error...

Will any one help me to correct this?


Below i list out the codings

ajax_db.html

<html>
<head>
<title>Connecting with DB</title>
<script type="text/javascript" src="ajax_db.js"> </script>

</head>

<body>

<form>
  Select a person
	<select name="users" onchange="showUser(this.value)">
		<option value="">Select a person:</option>
		<option value="1">Peter Griffin</option>
		<option value="2">Lois Griffin</option>
		<option value="3">Glenn Quagmire</option>
		<option value="4">Joseph Swanson</option>
	</select>
</form>

<br />
<div id="txtHint"><b>Person info will be listed here.</b></div>

</body>
</html>

ajax_db.js

function showUser(str)
 { 
  // document.write(str);

   if (str=="")
   {
       document.getElementById("txtHint").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("txtHint").innerHTML=xmlhttp.responseText;        
      }
   }

 try{
      //xmlhttp.open('GET','getuser.php?q='+str,true);
      xmlhttp.open('GET','http://192.168.100.152/~rekha/AJAX/getuser.php?q='+str,true);
      xmlhttp.send();    
    }catch(e)  {
   alert("Unable to connect with the server:\n" +e.toString());
 }
}

getuser.php

<?php

  $q = $_GET["q"];
  echo $q;

 	$con = mysql_connect("192.168.100.152", "DB", "bbscn107");
	if (!$con)
  {
  	die('Could not connect: ' . mysql_error());
  }

	mysql_select_db("TEST", $con);

	$sql="SELECT * FROM user WHERE id = '".$q."'";
  echo $sql;

  $result = mysql_query($sql);

  echo "<table border='1'>
  <tr>
		<th>Firstname</th>
		<th>Lastname</th>
		<th>Age</th>
		<th>Hometown</th>
		<th>Job</th>
	</tr>";

while($row = mysql_fetch_array($result))
  {
  	echo "<tr>";
  	echo "<td>" . $row['FirstName'] . "</td>";
  	echo "<td>" . $row['LastName'] . "</td>";
  	echo "<td>" . $row['Age'] . "</td>";
  	echo "<td>" . $row['Hometown'] . "</td>";
  	echo "<td>" . $row['Job'] . "</td>";
  	echo "</tr>";
  }
echo "</table>";

mysql_close($con);
?>

[HaLo2FrEeEk]

Have you tried making a direct request to getuser.php with a query string? For example, enter this into your browser:

http://192.168.100.152/~rekha/AJAX/getuser.php?q=1

Does it come up with anything? If it gives you the error, then the problem is with your database connection or query. Do that and post back the results and we'll help you more, right now there are too many things it could be.

[Rekha Kumaran]

Hi... Thanks for your reply. I typed as u said

http://192.168.100.152/~rekha/AJAX/getuser.php?q=1

But i got the same error

Unable to connect with the server:
[Object error]

http://192.168.100.152/~rekha/AJAX/getuser.php?q=1

If i type the above address in the browser, i can see the output. So now the problem is it doesnt call the PHP program.

Will u help me?

Advance Thanks...

[HaLo2FrEeEk]

All I needed to know was whether or not typing the path directly into the browser resulted in the error. I'm not 100% positive because I use jQuery, but I'm pretty sure you can't make AJAX calls to full URLs (http://something.com), some security thing or whatever. If you've got all 3 files in the same folder, then you need to remove this line:

xmlhttp.open('G ET','http://192.168.100.152/~rekha/AJAX/getuser.php?q=' +str,true);

And uncomment this line:

//xmlhttp.open('G ET','getuser.ph p?q='+str,true) ;

Do that and let me know what the result is. Also, this line:

document.getEle mentById("txtHi nt").innerHTML= xmlht tp.responseText ;

Make sure there is no space in the word xmlhttp. I don't know why I didn't see that earlier, but that's probably your problem.

[Rekha Kumaran]

I checked my program. There is no space in b/w xmlhttp.
document.getEle mentById("txtHi nt").innerHTML= xmlht tp.responseText ;

I kept all 2 files in the same folder. I uncomment the below line.

xmlhttp.open('G ET','getuser.ph p?q='+str,true) ;

I tried to run the program. But i got the same error message :(

My object xmlhttp.open wouldnt call the PHP program...

yyy?????

[HaLo2FrEeEk]

You said all 2 files, but there should be 3, ajax_db.html, ajax_db.js, and getuser.php.

Maybe someone else will be able to help you, because I see nothing wrong with the code, you pretty much copied it word-for-word from the w3schools site.

[Rekha Kumaran]

Sorry... I have all 3 files in the same folder... But i cant able to run it... Im getting the error msg... :(