JavaScript doesn't update Internet Explorer if same query sent before

Question

I'm working on a checklist were users can set 4 diffent option on a while cliking on it. When you click once, the is green and display "ok", once more, grey and "N/A", then white and empty. After it starts again to green and "OK" Each time I update my database with the value 1,2,3 or 0 for each possibilities. The javascript works great, color and text are updated correctly in all browsers everytime I click on the For the update of the database, it works as well, until I go back to the white or 0 in the database. I click, it updates to 1, then 2, then 3, then 0, then when you should get 1 it doesn't update it anymore. I don't have this issue with chrome.

Here is the Javascript code :

function CheckLog(TDCheck,ID){ 
var url;
var Color;
var Status;
var Text;
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request");
 return;
 }
 var TD = document.getElementById("TDCheck"+TDCheck);
 if(TD.style.backgroundColor == "white"){
    Color = "green";
    Status = "1";
    Text = "OK";
 }
 else if(TD.style.backgroundColor == "green"){
    Color = "grey";
    Status = "2";
    Text = "N/A";
 }
 else  if(TD.style.backgroundColor == "grey"){
    Color = "red";
    Status = "3";
    Text = "KO";
 }
 else  if(TD.style.backgroundColor == "red"){
    Color = "white";
    Status = "0";
    Text = "";
 }

url="Checklist/checklog.php";
url=url+"?ID="+ID+"&TDCHECK="+TDCheck+"&Status="+Status;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,false);
xmlHttp.onreadystatechange = function()
{
       if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
                  alert(xmlHttp.responseText);
         }
      }

xmlHttp.send(null);
document.getElementById("TDCheck"+TDCheck).style.backgroundColor=Color;
document.getElementById("TDCheck"+TDCheck).innerHTML=Text;
}

Checklog.php :

<?php
try
    {
        $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
        $bdd = new PDO('mysql:host=localhost;dbname=dbname', 'database', 'password');

    }
        catch(Exception $e)
    {
        die('Erreur : '.$e->getMessage());
    }

if(isset($_GET["TDCHECK"]))
{
    $bdd->exec("update ChecklistNew SET ".$_GET["TDCHECK"]." = '".$_GET["Status"]."' WHERE ID = '".$_GET["ID"]."'");
}   

?>

I have removed PDO in case it was the issue and use mysql_connect, but still the same. By using the response text, I monitor my sql request and I can see one thing :

I click first, the query looks like :

update ChecklistNew SET A2 = '1' WHERE ID = '4'
then 
update ChecklistNew SET A2 = '2' WHERE ID = '4'

Then if I update the php file with "update ChecklistNew SET TD = number WHERE ID = 'Idnum'" (I added quotes arround the ID)

update ChecklistNew SET A2 = '4' WHERE `ID` = '4'
then 
update ChecklistNew SET A2 = '0' WHERE `ID` = '4'
then
update ChecklistNew SET A2 = '1' WHERE ID = '4'
then 
update ChecklistNew SET A2 = '2' WHERE ID = '4'

Notice that It kept the previous query. :)... I think there is something there.

I'll appreciate any help!

maybe the issue is how you call `CheckLog` function. In your first example you say that you click once, yet you see 2 UPDATE queries... seems it is executing checklog.php more than once per click? — Naryl, Feb 13 '13 at 11:22
No, I click again, it's why I add "then". I should say : first -> then. Each query is a click. (english is not native for me). — user2068020, Feb 13 '13 at 11:25

score 2 · Accepted Answer · edited May 23 '17 at 11:50

2

IE caches XMLHttpRequests that use GET method, so it's just that.

You can do one of many things, the simplest being:

don't use GET for updating; switching to POST will fix your problem; use send("POST", ...) instead of send("GET", ...), you do not need to change anything on the PHP side (because even for POST requests $_GET gets populated with query parameters);
add random anything to the URL. it could be as simple as an unused parameter with a random number. Like: url=url+"?ID="+ID+"&TDCHECK="+TDCheck+"&Status="+Status + "&random=" + Math.random()

WARNING: your PHP script is extremely unsafe, it has multiple SQL injection vulnerabilities. FIX IT NOW. (See also How can I prevent SQL injection in PHP?)

edited May 23 '17 at 11:50

Community

1
1

answered Feb 13 '13 at 11:44

fdreger

12,264
1
36
42

+1 for the [SQL injection](http://php.net/manual/en/security.database.sql-injection.php) warning. – Martijn Feb 13 '13 at 11:50
That's it! Thank you very much! For the SQL injection, I switch back to PDO, now that I know it's not the issue! Appreciate the time taken to help me. – user2068020 Feb 13 '13 at 12:06

dognose · Answer 2 · 2013-02-13T11:51:47.647

It is simple, that your browser is Caching the result.

I.e. if you are calling Checklist/checklog.php?check=2 and do the same call later (second execution or sth.) Your browser wont actually Trigger the serverside script, because he knows the outcome already. (Cache). Therefore your serverside logic isn't executed.

as a solution, pass a timestamp along with your Ajax call.

url="Checklist/checklog.php";
url=url+"?ID="+ID+"&TDCHECK="+TDCheck+"&Status="+Status + "r=" + (new Date().getTime());

this results in different URLs each call, and nothing is cached. (or at least the Cache is not reused)

But Keep in mind, that you should create the random-part RIGHT before doing the request. If you are saving the URL somewhere in your code, and reuse that URL, you'll ran into the same issues, because ist equal again.

JavaScript doesn't update Internet Explorer if same query sent before

2 Answers2