XMLHttpRequest passes a variable to a PHP script

Question

I am trying to pass a variable to a PHP script using XMLHttpRequest and then return php back. I do not understand why it does not work, can someone help me. Here is the javascript.

<script language="javascript" type="text/javascript"> // Browser Support function Heatctrl(heatMode){ var heatControlRequest; try{ //Good Browsers heatControlRequest = new XMLHttpRequest(); } catch (e) { //Internet Explorer try{ heatControlRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ heatControlRequest = new ActiveXObject("Microsoft.XMLHTTP"); }catch (e) { alert("Brower not supported"); return false; } } } // Function to receive data from server and store in variable heatControlRequest.onreadystatechange = function(){ if (heatControlRequest.readystate == 4){ alert(heatControlRequest.responseText); //document.getElementById("controlMode").innerHTML=heatControlRequest.responseText; //var heatControlResponse = heatControlRequest.responseText; } } var url = "heatControl.php?heatmode="+heatMode; // Send the request heatControlRequest.open("GET", url, true); heatControlRequest.send(); } </script> 

HTML

  <div id="boilerButtons"> <button type="button" onclick="Heatctrl('On')">Heating On</button> <button type="button" onclick="Heatctrl('Off')">Heating Off</button> <button type="button" onclick="Heatctrl('Boost')">Boost</button> </div> 

and php

 <?php $controlMode = $_GET['heatmode']; echo $controlMode; ?> 

Any help is much appreciated, I work in electronics, not programming, and I struggled with it now for two days.

Answer 1

The problem is this line:

 if (heatControlRequest.readystate == 4){ ^ this should be an uppercase S 

It should be:

 if (heatControlRequest.readyState == 4){ 

From docs :

An XMLHttpRequest object can be in several states. The readyState attribute should return the current state.