Page 1 of 1

Help(Unsolved): XMLHTTP

Posted: Sun Jul 31, 2005 3:41 pm
by raghavan20
I was trying to run an example which involves XMLHTTP but for some reason it doesnt work. Do help me find the problem with the code


//trial.html

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<title>ZIP Code to City and State using XmlHttpRequest</title> 

<script language="javascript"  type="text/javascript">


function handleHttpResponse(http) {
	alert('inside handleHttpResponse fn');
	alert('http ready state:' + http.readyState);
	if (http.readyState == 4) {
		// Split the comma delimited response into an array
		alert('http is ready to receive output from php doc');
		results = http.responseText;
		alert ("received output:" + results);
		results = results.split(",");
		document.getElementById('city').value = results[0];
		document.getElementById('state').value = results[1];
	}
}

function updateCityState() {
	alert('inside updateCityState fn');
	var url = "getCityState.php?param="; // The server-side script
	var http = getHTTPObject(); // We create the HTTP Object
	var zipValue = document.getElementById("zip").value;
	http.open("GET", url + escape(zipValue), true);
	http.send();
	http.onreadystatechange = handleHttpResponse(http);
	http.send(null);
}

function getHTTPObject() {
  var xmlhttp;
  	req = false;
    // branch for native XMLHttpRequest object
    if(window.XMLHttpRequest) {
    	try {
			xmlhttp = new XMLHttpRequest();
        } catch(e) {
			xmlhttp = false;
        }
    // branch for IE/Windows ActiveX version
    } else if(window.ActiveXObject) {
       	try {
        	xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      	} catch(e) {
        	try {
          		xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        	} catch(e) {
          		xmlhttp = false;
        	}
		}
    }

  return xmlhttp;
}

</script></head> 
<body> 
<form action="post"> 
  <p> 
  ZIP code: 
  <input type="text" size="5" name="zip" id="zip" onblur="updateCityState();" /> 
  </p> 
  City: 
  <input type="text" name="city" id="city" /> 
  State: 
  <input type="text" size="2" name="state" id="state" /> 
</form> 
</body> 
</html> 



PHP Code:

Code: Select all

<?php 
//getCityState.php 
echo "Stoke-on-trent, Staffordshire"; 
?>
Can any of you explain me the function getHTTPObject()?
I understand that they are trying to create 'Msxml2.XMLHTTP', if not possible they are trying to create 'Microsoft.XMLHTTP'. What's the meaning of next few lines? what is the meaning of @ symbol before if, else and end keywords.

You can see the script in action at:
http://raghavan20.allhyper.com/trial.html
http://raghavan20.allhyper.com/getCityState.php

Posted: Wed Aug 03, 2005 1:40 am
by andre_c
if it couldn't create any of those (maybe because the browser is not ie), it attempts to use the firefox/mozilla/opera/safary way: new XMLHttpRequest()

Posted: Thu Aug 04, 2005 2:19 pm
by raghavan20
This is the recently modified code and you can see the script in action using the links in the previous thread.
Give the file a run to see the interactive process.
http://raghavan20.allhyper.com/trial.html

Code: Select all

<script language="javascript"  type="text/javascript">


function handleHttpResponse(http) {
	alert('inside handleHttpResponse fn');
	alert('http ready state:' + http.readyState);
	if (http.readyState == 4) {
		// Split the comma delimited response into an array
		alert('http is ready to receive output from php doc');
		results = http.responseText;
		alert ("received output:" + results);
		results = results.split(",");
		document.getElementById('city').value = results[0];
		document.getElementById('state').value = results[1];
	}
}

function updateCityState() {
	alert('inside updateCityState fn');
	var url = "getCityState.php?param="; // The server-side script
	var http = getHTTPObject(); // We create the HTTP Object
	var zipValue = document.getElementById("zip").value;
	http.open("GET", url + escape(zipValue), true);
	http.send();
	http.onreadystatechange = handleHttpResponse(http);
	http.send(null);
}

function getHTTPObject() {
  var xmlhttp;
  	req = false;
    // branch for native XMLHttpRequest object
    if(window.XMLHttpRequest) {
    	try {
			xmlhttp = new XMLHttpRequest();
        } catch(e) {
			xmlhttp = false;
        }
    // branch for IE/Windows ActiveX version
    } else if(window.ActiveXObject) {
       	try {
        	xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      	} catch(e) {
        	try {
          		xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        	} catch(e) {
          		xmlhttp = false;
        	}
		}
    }

  return xmlhttp;
}

</script>