Controlling XMLHttpRequest Response

Dev Shed Forums Sponsor:

January 25th, 2013, 08:32 AM

chofift

Registered User

Join Date: Dec 2012

Posts: 28

Time spent in forums: 5 h 2 m 41 sec
Reputation Power: 0

Controlling XMLHttpRequest Response

Here's what I tried:
glike.php

PHP Code:


		
			
//...



if ($q) {

echo (1);

} else {

echo (0);

}

question.html

Code:

 
  javascript Code: 
	
   
     
        
           
             
               Original
                - javascript Code 
             
           
           
             
              <script>//...
if (xmlhttp.readyState==4 && xmlhttp.status==200) {

  //...  

  var answer = xmlhttp.responseText;

  if (answer == 1) {
    alert('You like this game');
  } else {
    alert('Oops');
  }

}

</script> 
             
           
         
     
   
  
  <script>//...
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
 
  //...  
 
  var answer = xmlhttp.responseText;
 
  if (answer == 1) {
    alert('You like this game');
  } else {
    alert('Oops');
  }
 
}
 
</script>

This works fine but only when I open/send the request using GET. It doesn't work for POST! Any idea why and what could b the solution?

January 25th, 2013, 08:44 AM

Jacques1

pollyanna

Join Date: Jul 2012

Location: Germany

Posts: 2,033

Time spent in forums: 1 Month 2 Weeks 6 Days 20 h 59 m 13 sec
Reputation Power: 812

Hi,

what do you mean by "it doesn't work"?

Does the request itself fail? If so, what's the exact error message (on the JavaScript console of your browser)? Are you sure you got the request logic right?

Or is it a PHP problem? If so, are you sure you're reading from $_POST rather than $_GET?

January 25th, 2013, 09:33 AM

chofift

Registered User

Join Date: Dec 2012

Posts: 28

Time spent in forums: 5 h 2 m 41 sec
Reputation Power: 0

Quote:

Originally Posted by Jacques1

Yes, I use the same code. The only thing I change is the method I use to open/send the request:

NOK code:

PHP Code:


		
			
if (isset($_POST['a'])){ 

  $a = $_POST['a']; 



  if ($a == '1'){ 

    echo (1); 

  } else { 

    if ($a == '0'){ 

     echo (0); 

   } else { 

      echo (9); 

   } 

  } 

} else { 

  echo ("This is not an answer!"); 

}

Code:


 
  javascript Code: 
	
   
     
        
           
             
               Original
                - javascript Code 
             
           
           
             
              
<script>
function loadXMLDoc()
{
var xmlhttp;
var answer;

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("a_box").innerHTML=xmlhttp.responseText;

    answer = xmlhttp.responseText;
    if (answer == 1){
     alert('You like the game!!');
    }
    
    if (answer == 0){
     alert('You dont like the game!!');
    }

    if (answer == 9){
     alert('What??!!');
    }
    
    } else {
      document.getElementById("debugDiv").innerHTML = xmlhttp.readyState+ " ... " + xmlhttp.status;
    }
  }

var a = document.getElementById("a").value;

xmlhttp.open("POST","glike.php?a="+a,true);
xmlhttp.send();
}
</script>

 
             
           
         
     
   
  
   
 
<script>
function loadXMLDoc()
{
var xmlhttp;
var answer;
 
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("a_box").innerHTML=xmlhttp.responseText;
 
    answer = xmlhttp.responseText;
    if (answer == 1){
     alert('You like the game!!');
    }
    
    if (answer == 0){
     alert('You dont like the game!!');
    }
 
    if (answer == 9){
     alert('What??!!');
    }
    
    } else {
      document.getElementById("debugDiv").innerHTML = xmlhttp.readyState+ " ... " + xmlhttp.status;
    }
  }
 
var a = document.getElementById("a").value;
 
xmlhttp.open("POST","glike.php?a="+a,true);
xmlhttp.send();
}
</script>

Everything will work fine if you decide to do GET!

NOTE: in both methods get/post. If I remove this line:

Code:

document.getElementById("a_box").innerHTML=xmlhttp.responseText;

The readyState is always 3!! Yet my alert messages work when I use GET! Strange because if it's 3, the 4 never get true and 4 comes always after 3 (process).

January 25th, 2013, 09:48 AM

Jacques1

pollyanna

Join Date: Jul 2012

Location: Germany

Posts: 2,033

Time spent in forums: 1 Month 2 Weeks 6 Days 20 h 59 m 13 sec
Reputation Power: 812

You do not use the right request code. Please check the link I gave you. A POST request is very different from a GET request, you cannot just change xmlhttp.open("GET" ...) to xmlhttp.open("POST" ...).

Also consider using a framework like jQuery to get rid of lowlevel HTTP stuff.

January 25th, 2013, 10:46 AM

chofift

Registered User

Join Date: Dec 2012

Posts: 28

Time spent in forums: 5 h 2 m 41 sec
Reputation Power: 0

Code:


 xmlhttp.open("POST","a.php",true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("a="+a);

This works fine, I forgot the "+" in the source code.
Other headers with content length and connection don't seem to be OK.

Now, why does xmlhttp.readyState always return 3 when 4 is true?

Thx

Controlling XMLHttpRequest Response

Developer Shed Advertisers and Affiliates