Hello all,

I recently began playing with Ajax, and it seems to be somewhat unstable, in that the exact same code sometimes works as expected, and other times it doesn't.

I'm just experimenting with dynamic form validation at the moment, but I can't seem to wrap my brain around what I've done wrong. If anyone has any advice it would be greatly appreciated.

I have a form with only a single field. I'm using ajax to sent the data to a php script which either returns nothing (if the data is valid) or a html string (if it's invalid) which I then output to the form.

The html code is as follows:


Code HTML4Strict:
<html>
 <head>
  <title>Test Form</title>
  <script src='ajax.js'></script>
  <script type='text/javascript'>
   function CheckInfo(Type)
    {
     var xmlHttp=GetXmlHttpObject();
     var url='CheckInfo.php';
     url=url+'?Type='+Type+'&Data='+document.getElementById(Type).value;
     alert(url);
     xmlHttp.open("GET", url, true);
     xmlHttp.send(null);
     xmlHttp.onreadystatechange=function()
      {
       if(xmlHttp.readyState==4 && xmlHttp.status==200)
        {
         var Response=xmlHttp.responseText;
         var Str=Type+'Field';
         alert("Response = "+Response);
         if(Reponse!='')
          {
           document.getElementById(Str).innerHTML='<br />'+Response;
          }
         else
          {
           document.getElementById(Str).innerHTML='';
          }
        }
      }
    }
  </script>
  <link rel='stylesheet' href='test.css'>
 </head>
 <body>
  <table width='100%' style='border: 3px solid black;'>
   <tr height='10'>
    <td width='50%'>Name</td>
    <td width='50%'><input type='text' size='30' name='Name' id='Name' onChange="CheckInfo('Name');"><span id='NameField'></span></td>
   </tr>
  </table>
 </body>
</html>


The ajax.js script is:


Code JavaScript:
function GetXmlHttpObject()
 {
  alert ("GetXmlHttpObject Called");
  var xmlHttp;
  try
   {
    xmlHttp=new XMLHttpRequest(); //Firefox
   }
  catch(ff)
   {
    try
     {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); //Internet Explorer
     }
    catch(ie)
     {
      try
       {
        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); //Internet Explorer 2
       }
      catch(ie2)
       {
        return false;
       }
     }
   }
  return xmlHttp;
 }



The PHP script works perfectly every time, so that's not the problem. I added the alerts to try and debug, but I'm still confused. Every time the field changes, the xmlHttp object is created, and the request sent alert pops up (with the correct request URL); but for whatever reason, the request never makes it back to the server. (running a tail -f on the apache access_log indicates that not all of the requests are arriving). Could this possibly be due to server load? Or have I messed something up on the client side?

Thanks again for any insight you can provide

--
Chris