PHP and AJAX Caching Bug

Wow, this one “bugged” me for days. 

I have a PHP form that gets data from Oracle.  When I click the submit button, I want another page to process some script to keep a many-to-many table up to data.

For example:

<input type=submit onClick=submitDistricts($PUBID)>

The Javascript calls a GET

function submitDistricts(PUBID)
{
var xmlHttp = getXMLHttp();
    xmlHttp.onreadystatechange = function()
  {
    if(xmlHttp.readyState == 4)
    {
      HandleDistrictResponse(xmlHttp.responseText);
    }
  }
 xmlHttp.open(“GET”, “updateDistricts.php?PUBID=”+PUBID);
  xmlHttp.send(null);
}

And this works pretty well.  Except that the call gets cached and I can only submit it once.  YIKES!!

How did I fix it?  Well ensure the GET is always unique.

Change the line from:

xmlHttp.open(“GET”, “updateDistricts.php?PUBID=”+PUBID);

TO:

xmlHttp.open(“GET”, “updateDistricts.php?PUBID=”+PUBID + ‘&’ + Math.random());

That’s it. Now my AJAX call to the database is always unique and has no caching…

That was a weird one!