Ajax Basics

SUNIL16 · March 15, 2010

Hi Friends,

why i am not able fetch message in data.txt file

<html>
<head><title>Ajax Demo</title>
<script language="javascript">
var XMLHttpRequestObject = false;

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

function get_data(sourcedata, DivId)
{
if(XMLHttpRequestObject)
{
var obj=document.getElementById(DivId);
XMLHttpRequestObject.open("GET", sourcedata);

XMLHttpRequestObject.OnreadyStateChange=function()
{
if(XMLHttpRequestObject.readystate == 4 && XMLHttpRequestObject.status ==200)
{
obj.innerHTML=XMLHttpRequestObject.ResponseText;
}

}

XMLHttpRequestObject.Send(null);
}
}


</script>

</head><body>
<h1> Ajax demo</h1>
<form>
<input type="button" value="fetch message" OnClick="get_data('data.txt','targetdiv')">
</form>
<div id="targetdiv">
<p>fetched message will apear here</p>
</div>
</body></html>

Where i went wrong?

SUNIL16 · March 15, 2010

Its working in IE wen made XMLHttpRequestObject = new ActiveXObject("Microsoft", "XMLHTTP");

to XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");

Its not working in Morzilla, chrome y?

ScotDiddle · March 16, 2010

SUNIL16,

Here is a different ajax script, and a different paradigm that works :


<?php


Header("Cache-control: private, no-cache");
Header("Expires: Mon, 7 Oct 2002 05:00:00 GMT");
Header("Pragma: no-cache");

?>


<html>

<head>

<title>Ajax Demo</title>

<script>

/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects="";
var rootdomain="http://"+window.location.hostname;
var bustcacheparameter="";

function get_data (url, containerid) {

	var page_request = false;

	if (window.XMLHttpRequest) { // if Mozilla, Safari etc
		page_request = new XMLHttpRequest();
		alert('Firefox');
	}
	else if (window.ActiveXObject) { // if IE

		try {
			page_request = new ActiveXObject("Msxml2.XMLHTTP");
			alert('xml2');
		}
		catch (e) {

			try {
				page_request = new ActiveXObject("Microsoft.XMLHTTP");
				alert('m$');
			}
			catch (e){}
		}
	}
	else {
		return false;
	}

	page_request.onreadystatechange=function() {

		// alert(page_request);
		// alert(containerid);

		loadpage(page_request, containerid);
	}

	if (bustcachevar) { //if bust caching of external page
		bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime();
	}

	page_request.open('GET', url+bustcacheparameter, true);
	page_request.send(null);

} // END function ajaxpage(url, containerid)

function loadpage(page_request, containerid) {

	// alert(page_request);
	// alert(containerid);

	if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1)) {
		document.getElementById(containerid).innerHTML=page_request.responseText;
	}

} // END function loadpage(page_request, containerid) {

function loadobjs() {

	if (!document.getElementById) {
		return;
	}

	for (i=0; i<arguments.length; i++) {

		var file=arguments[i];

		var fileref="";

		if (loadedobjects.indexOf(file)==-1) { //Check to see if this object has not already been added to page before proceeding

			if (file.indexOf(".js")!=-1) { //If object is a js file

				fileref=document.createElement('script');
				fileref.setAttribute("type","text/javascript");
				fileref.setAttribute("src", file);
			}
			else if (file.indexOf(".css")!=-1) { //If object is a css file

				fileref=document.createElement("link")
				fileref.setAttribute("rel", "stylesheet");
				fileref.setAttribute("type", "text/css");
				fileref.setAttribute("href", file);
			}

		} // END if (loadedobjects.indexOf(file)==-1) {

		if (fileref!="") {
			document.getElementsByTagName("head").item(0).appendChild(fileref)
			loadedobjects+=file+" " //Remember this object as being already added to page
		}

	} // for (i=0; i<arguments.length; i++) {

} // END function loadobjs() {

</script>

</head>

<body>

<h1> Ajax demo</h1>
<form>
<input type="button" value="fetch message" onClick="get_data('showData.php','targetdiv');">
</form>
<div id="targetdiv">
<p>fetched message will apear here</p>
</div>

</body>
</html>

where:

showData.php looks like this:


<?php


Header("Cache-control: private, no-cache");
Header("Expires: Mon, 7 Oct 2002 05:00:00 GMT");
Header("Pragma: no-cache");

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
</head>

<body>

<?php

$myData = file_get_contents('data.txt');

echo $myData;

?>

</body>

</html>

Worked for me in both IE and FF.

Scot L. Diddle, Richmond VA

Sign In

Ajax Basics

Recommended Posts

SUNIL16

Link to comment

Share on other sites

SUNIL16

Link to comment

Share on other sites

ScotDiddle

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information