onreadystatechange results in php code executing twice

Question

In my onreadystatechange inline function in my Ajax code, I call window.location and pass a GET parameter to the new web page.

For some reason the php code on that new page executes twice in quick succession. I don't think that is correct behavior.

Here's the Ajax code, in javascript:

// this is called from the 'onclick()' handler of a normal (non-'submit') button
function findUserData()
{

 var user = document.getElementById('zer').value;
 var pwd = document.getElementById('pwd').value;

 var xmlhttp;

 if(window.XMLHttpRequest)
 {
    xmlhttp = new XMLHttpRequest();
 }
 else
 {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
 }

 var theResponseText = "rText";

 xmlhttp.onreadystatechange = function()
 {
    if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
    {
        theResponseText = xmlhttp.responseText;
        alert("responseText is >>>" + theResponseText + "<<< that.");

        if( theResponseText == 'notfound')
        {
            alert("No data found with that user name/password.")
            //return;
        }
        else if( theResponseText == 'found')
        {
            alert("Data was found with that user name/password.")
            window.location = "postData.php?datapull=1";
            //return;
        }
    }
    else  // EDIT -- ADDED THIS TO CHECK FOR OTHER (readyState, status) PAIRS
    {
        alert("the readyState is: " + xmlhttp.readyState
              + " and the status is: " + xmlhttp.status);
    }
  }

  var ajaxText = "checkForData.php?zer=" + user + "&pwd=" + pwd;
  xmlhttp.open("GET", ajaxText, true);
  xmlhttp.send();
}

(The php file "checkForData.php" just looks up the username/password combo ('zer' and 'pwd') in the database to see if that user/password has any records in the database and returns "found" if they have records. In my test of this code, I enter a valid user user/pwd combination, and the checkForData.php code successfully returns 'found' as the responseText.)

Here is postData.php:

<?php
if(isset($_GET['datapull']))
{

    echo '<script type="text/javascript">'
         . 'alert("We just got a redirect form the Ajax code")</script>';
    $datapull = $_GET['datapull'];

    if($datapull == 1)
    {
        echo '<script type="text/javascript">'
         . 'alert("about to pull data")</script>'; 
    }
}

?>

I know that the onreadystatechange inline function is not executing twice because I have an alert() box when the inline function executes (see above), and that alert box only appears one time and reports "Data was found with that user name/password."

The output I see is:

0) I get an alert() box that says "responseText is >>>found<<< that." then I get an alert() box that says "Data was found with that user name/password."

1) I get an alert() box that says "We just got a redirect from the Ajax code"

2) then I see an alert() box that says "about to pull data"

3) and I then get a second alert box that says "We just got a redirect from the Ajax code"

4) next, another alert box that says "about to pull data"

Is there something I can change to make the window.location() cause my postData.php code to execute only once? Why does the postData.php page load twice?

do you have a submit button in your form? it could be possible that your form submit is also getting executed. can you post your form code? — Harry, Aug 10 '13 at 05:48
I have no form here -- I added the 'findUserData()' function head at the top of my code above to clarify that. I'm using Ajax in this code solely to avoid having to do a POST -- when the user enters their name and password they click a button and its 'onclick' calls the above 'findUserData()' and if there is no data, I want to keep the user on the same page, I don't want to do a POST only to find out there's no user data, so I use the Ajax code to first check if this user has any data stored and ONLY THEN do I navigate them to another page (by way of window.location). — CFHcoder, Aug 10 '13 at 06:22
I tried your code (except with hard-coded response value for the AJAX call) in my local machine and I don't see any double triggering. Perhaps some other part of your code is causing the issue. — Harry, Aug 10 '13 at 07:00

score 1 · Answer 1 · answered Aug 10 '13 at 06:33

1

Try an else for the if(xmlhttp.readyState == 4 && xmlhttp.status == 200) statement to see if there's another state that the ajax call goes into before readystate 4. Maybe just put alert(xmlhttp.readyState); in the else and see what happens.

answered Aug 10 '13 at 06:33

MrRaymondLee

546
5
12

There are other states mate (from 0-4) but I don't think the status would be 200 for any of the other states. So, that shouldn't be a problem. – Harry Aug 10 '13 at 06:44
Yeah but do you see them come up at the same time? I mean if you put added an else with the alert, do you see the alert fire then your code block in state 4? I don't have any way to test now but maybe XMLHttpRequest or Microsoft.XMLHTTP does hit the PHP twice causing the alerts from the PHP to show twice. – MrRaymondLee Aug 10 '13 at 06:50
I added an 'else' clause to check the 'readyState' and 'status' and used an alert() box to report them as they arrived at the onreadystatechange inline function -- I get the following pairs of (readyState, status) just before the (4, 200) that results in the **window.location** redirect -- I get (readyState, status) in this order: (1, 0) then (2, 200) then (3, 200), and then the (4, 200) comes in. And nothing else. So as Harry suggested, man there's got to be something else causing this. See my code sample above, I modified it to show how I added this new 'else' clause. – CFHcoder Aug 10 '13 at 07:38
Things like this make you happy you have version control. I'm going to have to roll back to an earlier version of the code because it will probably be the fastest way to figure this out. My postData.php file has more code than I've shown here, I only showed the part that's relevant, and I'll have to re-code it very incrementally starting from an earlier version to find out what's causing the double-load of postData.php – CFHcoder Aug 10 '13 at 08:05

score 0 · Accepted Answer · answered Aug 11 '13 at 05:13

I did not find the cause for the double-triggering, it was more expedient to revert to the day-before's code snapshot and very incrementally recode the work, and I'm no longer getting the double-loading symptom. I took a different approach to the features I had added and somehow bypassed whatever was causing the double post. I don't have time at present to figure out what was causing the double-post, but will diff the files a bit later.

score 0 · Answer 3 · answered Dec 13 '16 at 06:13

While working with one of my Apache Cordova project I also face the same issue. Unfortunately, I still don't understand why exactly the code execute twice, but clearing your div just after 200 status helped for my case.

Here is the example:

if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
     $('#divId').empty();   //Clear the div
     // Now start your code
}

Can't say about the other ripple effects, but it worked for me.

onreadystatechange results in php code executing twice

3 Answers3